@charset "UTF-8";
/*
*	This App specific styles
*	Only used for DataGrip
*/
/*
* All parameterized palette elements
*/
html {
  font-size: 12pt;
}

/*
*	TREMe colors
*/
/*
*	Layout elements
*/
/*
*	Content elements
*/
/*
*	UI elements
*/
/*
*	Form elements
*/
/*
Aqui van los estilos standard de Datagrip DARK SIN cambios
para un determinado cliente/aplicacion
Estos estilos se sobreponen a los estilos establecidos en _palette

MAZ- 2016-10-14- Paleta actualizada y ajustada al nuevo site 
*/
#sent i, #pending i, #info i, #new i, #syncro i, #me i {
  color: #dfdfdf;
}
#sent h2, #pending h2, #info h2, #new h2, #syncro h2, #me h2 {
  color: #fff;
}
#sent p, #pending p, #info p, #new p, #syncro p, #me p {
  color: #eee;
}
#sent em, #pending em, #info em, #new em, #syncro em, #me em {
  color: #fff;
}

/*
*	 Customized logos and images
*/
img.logo {
  width: 180px;
}

#datagrip {
  color: #2f2f2f;
}
#datagrip img {
  margin-top: 10pt;
  width: initial;
  height: 70px;
  border: 0px dotted cyan;
}
#datagrip p.sp {
  margin-bottom: 0.4rem;
}
#datagrip p.sp a {
  font-size: 0.9rem;
  color: #ff5f40;
}

#logo {
  color: #2f2f2f;
}
#logo p {
  color: #2f2f2f;
}
#logo img {
  margin: 8px 5px;
  max-width: 84%;
}
#logo p.sp {
  margin-bottom: 0.4rem;
}
#logo p.sp a {
  font-size: 0.9rem;
}

@font-face {
  font-family: "Nunito Light";
  src: url("../fonts/Nunito-Light.ttf") format("truetype");
}
@font-face {
  font-family: "Nunito Regular";
  src: url("../fonts/Nunito-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Nunito Semibold";
  src: url("../fonts/Nunito-SemiBold.ttf") format("truetype");
}
/*
@font-face {
  font-family: 'WeblySleek UI Light';
  src: url('../fonts/weblysleekuil.ttf')  format('truetype');
}
@font-face {
  font-family: 'WeblySleek UI';
  src: url('../fonts/weblysleekuisl.ttf')  format('truetype');
}
@font-face {
  font-family: 'WeblySleek UI Semibold';
  src: url('../fonts/weblysleekuisb.ttf')  format('truetype');
}
*/
/*!
  Ionicons, v2.0.0
  Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
  https://twitter.com/benjsperry  https://twitter.com/ionicframework
  MIT License: https://github.com/driftyco/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.0");
  src: url("../fonts/ionicons.eot?v=2.0.0#iefix") format("embedded-opentype"), url("../fonts/ionicons.ttf?v=2.0.0") format("truetype"), url("../fonts/ionicons.woff?v=2.0.0") format("woff"), url("../fonts/ionicons.svg?v=2.0.0#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,
.ion-ios-arrow-forward:before,
.ion-ios-arrow-left:before,
.ion-ios-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,
.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: "\f101";
}

.ion-alert-circled:before {
  content: "\f100";
}

.ion-android-add:before {
  content: "\f2c7";
}

.ion-android-add-circle:before {
  content: "\f359";
}

.ion-android-alarm-clock:before {
  content: "\f35a";
}

.ion-android-alert:before {
  content: "\f35b";
}

.ion-android-apps:before {
  content: "\f35c";
}

.ion-android-archive:before {
  content: "\f2c9";
}

.ion-android-arrow-back:before {
  content: "\f2ca";
}

.ion-android-arrow-down:before {
  content: "\f35d";
}

.ion-android-arrow-dropdown:before {
  content: "\f35f";
}

.ion-android-arrow-dropdown-circle:before {
  content: "\f35e";
}

.ion-android-arrow-dropleft:before {
  content: "\f361";
}

.ion-android-arrow-dropleft-circle:before {
  content: "\f360";
}

.ion-android-arrow-dropright:before {
  content: "\f363";
}

.ion-android-arrow-dropright-circle:before {
  content: "\f362";
}

.ion-android-arrow-dropup:before {
  content: "\f365";
}

.ion-android-arrow-dropup-circle:before {
  content: "\f364";
}

.ion-android-arrow-forward:before {
  content: "\f30f";
}

.ion-android-arrow-up:before {
  content: "\f366";
}

.ion-android-attach:before {
  content: "\f367";
}

.ion-android-bar:before {
  content: "\f368";
}

.ion-android-bicycle:before {
  content: "\f369";
}

.ion-android-boat:before {
  content: "\f36a";
}

.ion-android-bookmark:before {
  content: "\f36b";
}

.ion-android-bulb:before {
  content: "\f36c";
}

.ion-android-bus:before {
  content: "\f36d";
}

.ion-android-calendar:before {
  content: "\f2d1";
}

.ion-android-call:before {
  content: "\f2d2";
}

.ion-android-camera:before {
  content: "\f2d3";
}

.ion-android-cancel:before {
  content: "\f36e";
}

.ion-android-car:before {
  content: "\f36f";
}

.ion-android-cart:before {
  content: "\f370";
}

.ion-android-chat:before {
  content: "\f2d4";
}

.ion-android-checkbox:before {
  content: "\f374";
}

.ion-android-checkbox-blank:before {
  content: "\f371";
}

.ion-android-checkbox-outline:before {
  content: "\f373";
}

.ion-android-checkbox-outline-blank:before {
  content: "\f372";
}

.ion-android-checkmark-circle:before {
  content: "\f375";
}

.ion-android-clipboard:before {
  content: "\f376";
}

.ion-android-close:before {
  content: "\f2d7";
}

.ion-android-cloud:before {
  content: "\f37a";
}

.ion-android-cloud-circle:before {
  content: "\f377";
}

.ion-android-cloud-done:before {
  content: "\f378";
}

.ion-android-cloud-outline:before {
  content: "\f379";
}

.ion-android-color-palette:before {
  content: "\f37b";
}

.ion-android-compass:before {
  content: "\f37c";
}

.ion-android-contact:before {
  content: "\f2d8";
}

.ion-android-contacts:before {
  content: "\f2d9";
}

.ion-android-contract:before {
  content: "\f37d";
}

.ion-android-create:before {
  content: "\f37e";
}

.ion-android-delete:before {
  content: "\f37f";
}

.ion-android-desktop:before {
  content: "\f380";
}

.ion-android-document:before {
  content: "\f381";
}

.ion-android-done:before {
  content: "\f383";
}

.ion-android-done-all:before {
  content: "\f382";
}

.ion-android-download:before {
  content: "\f2dd";
}

.ion-android-drafts:before {
  content: "\f384";
}

.ion-android-exit:before {
  content: "\f385";
}

.ion-android-expand:before {
  content: "\f386";
}

.ion-android-favorite:before {
  content: "\f388";
}

.ion-android-favorite-outline:before {
  content: "\f387";
}

.ion-android-film:before {
  content: "\f389";
}

.ion-android-folder:before {
  content: "\f2e0";
}

.ion-android-folder-open:before {
  content: "\f38a";
}

.ion-android-funnel:before {
  content: "\f38b";
}

.ion-android-globe:before {
  content: "\f38c";
}

.ion-android-hand:before {
  content: "\f2e3";
}

.ion-android-hangout:before {
  content: "\f38d";
}

.ion-android-happy:before {
  content: "\f38e";
}

.ion-android-home:before {
  content: "\f38f";
}

.ion-android-image:before {
  content: "\f2e4";
}

.ion-android-laptop:before {
  content: "\f390";
}

.ion-android-list:before {
  content: "\f391";
}

.ion-android-locate:before {
  content: "\f2e9";
}

.ion-android-lock:before {
  content: "\f392";
}

.ion-android-mail:before {
  content: "\f2eb";
}

.ion-android-map:before {
  content: "\f393";
}

.ion-android-menu:before {
  content: "\f394";
}

.ion-android-microphone:before {
  content: "\f2ec";
}

.ion-android-microphone-off:before {
  content: "\f395";
}

.ion-android-more-horizontal:before {
  content: "\f396";
}

.ion-android-more-vertical:before {
  content: "\f397";
}

.ion-android-navigate:before {
  content: "\f398";
}

.ion-android-notifications:before {
  content: "\f39b";
}

.ion-android-notifications-none:before {
  content: "\f399";
}

.ion-android-notifications-off:before {
  content: "\f39a";
}

.ion-android-open:before {
  content: "\f39c";
}

.ion-android-options:before {
  content: "\f39d";
}

.ion-android-people:before {
  content: "\f39e";
}

.ion-android-person:before {
  content: "\f3a0";
}

.ion-android-person-add:before {
  content: "\f39f";
}

.ion-android-phone-landscape:before {
  content: "\f3a1";
}

.ion-android-phone-portrait:before {
  content: "\f3a2";
}

.ion-android-pin:before {
  content: "\f3a3";
}

.ion-android-plane:before {
  content: "\f3a4";
}

.ion-android-playstore:before {
  content: "\f2f0";
}

.ion-android-print:before {
  content: "\f3a5";
}

.ion-android-radio-button-off:before {
  content: "\f3a6";
}

.ion-android-radio-button-on:before {
  content: "\f3a7";
}

.ion-android-refresh:before {
  content: "\f3a8";
}

.ion-android-remove:before {
  content: "\f2f4";
}

.ion-android-remove-circle:before {
  content: "\f3a9";
}

.ion-android-restaurant:before {
  content: "\f3aa";
}

.ion-android-sad:before {
  content: "\f3ab";
}

.ion-android-search:before {
  content: "\f2f5";
}

.ion-android-send:before {
  content: "\f2f6";
}

.ion-android-settings:before {
  content: "\f2f7";
}

.ion-android-share:before {
  content: "\f2f8";
}

.ion-android-share-alt:before {
  content: "\f3ac";
}

.ion-android-star:before {
  content: "\f2fc";
}

.ion-android-star-half:before {
  content: "\f3ad";
}

.ion-android-star-outline:before {
  content: "\f3ae";
}

.ion-android-stopwatch:before {
  content: "\f2fd";
}

.ion-android-subway:before {
  content: "\f3af";
}

.ion-android-sunny:before {
  content: "\f3b0";
}

.ion-android-sync:before {
  content: "\f3b1";
}

.ion-android-textsms:before {
  content: "\f3b2";
}

.ion-android-time:before {
  content: "\f3b3";
}

.ion-android-train:before {
  content: "\f3b4";
}

.ion-android-unlock:before {
  content: "\f3b5";
}

.ion-android-upload:before {
  content: "\f3b6";
}

.ion-android-volume-down:before {
  content: "\f3b7";
}

.ion-android-volume-mute:before {
  content: "\f3b8";
}

.ion-android-volume-off:before {
  content: "\f3b9";
}

.ion-android-volume-up:before {
  content: "\f3ba";
}

.ion-android-walk:before {
  content: "\f3bb";
}

.ion-android-warning:before {
  content: "\f3bc";
}

.ion-android-watch:before {
  content: "\f3bd";
}

.ion-android-wifi:before {
  content: "\f305";
}

.ion-aperture:before {
  content: "\f313";
}

.ion-archive:before {
  content: "\f102";
}

.ion-arrow-down-a:before {
  content: "\f103";
}

.ion-arrow-down-b:before {
  content: "\f104";
}

.ion-arrow-down-c:before {
  content: "\f105";
}

.ion-arrow-expand:before {
  content: "\f25e";
}

.ion-arrow-graph-down-left:before {
  content: "\f25f";
}

.ion-arrow-graph-down-right:before {
  content: "\f260";
}

.ion-arrow-graph-up-left:before {
  content: "\f261";
}

.ion-arrow-graph-up-right:before {
  content: "\f262";
}

.ion-arrow-left-a:before {
  content: "\f106";
}

.ion-arrow-left-b:before {
  content: "\f107";
}

.ion-arrow-left-c:before {
  content: "\f108";
}

.ion-arrow-move:before {
  content: "\f263";
}

.ion-arrow-resize:before {
  content: "\f264";
}

.ion-arrow-return-left:before {
  content: "\f265";
}

.ion-arrow-return-right:before {
  content: "\f266";
}

.ion-arrow-right-a:before {
  content: "\f109";
}

.ion-arrow-right-b:before {
  content: "\f10a";
}

.ion-arrow-right-c:before {
  content: "\f10b";
}

.ion-arrow-shrink:before {
  content: "\f267";
}

.ion-arrow-swap:before {
  content: "\f268";
}

.ion-arrow-up-a:before {
  content: "\f10c";
}

.ion-arrow-up-b:before {
  content: "\f10d";
}

.ion-arrow-up-c:before {
  content: "\f10e";
}

.ion-asterisk:before {
  content: "\f314";
}

.ion-at:before {
  content: "\f10f";
}

.ion-backspace:before {
  content: "\f3bf";
}

.ion-backspace-outline:before {
  content: "\f3be";
}

.ion-bag:before {
  content: "\f110";
}

.ion-battery-charging:before {
  content: "\f111";
}

.ion-battery-empty:before {
  content: "\f112";
}

.ion-battery-full:before {
  content: "\f113";
}

.ion-battery-half:before {
  content: "\f114";
}

.ion-battery-low:before {
  content: "\f115";
}

.ion-beaker:before {
  content: "\f269";
}

.ion-beer:before {
  content: "\f26a";
}

.ion-bluetooth:before {
  content: "\f116";
}

.ion-bonfire:before {
  content: "\f315";
}

.ion-bookmark:before {
  content: "\f26b";
}

.ion-bowtie:before {
  content: "\f3c0";
}

.ion-briefcase:before {
  content: "\f26c";
}

.ion-bug:before {
  content: "\f2be";
}

.ion-calculator:before {
  content: "\f26d";
}

.ion-calendar:before {
  content: "\f117";
}

.ion-camera:before {
  content: "\f118";
}

.ion-card:before {
  content: "\f119";
}

.ion-cash:before {
  content: "\f316";
}

.ion-chatbox:before {
  content: "\f11b";
}

.ion-chatbox-working:before {
  content: "\f11a";
}

.ion-chatboxes:before {
  content: "\f11c";
}

.ion-chatbubble:before {
  content: "\f11e";
}

.ion-chatbubble-working:before {
  content: "\f11d";
}

.ion-chatbubbles:before {
  content: "\f11f";
}

.ion-checkmark:before {
  content: "\f122";
}

.ion-checkmark-circled:before {
  content: "\f120";
}

.ion-checkmark-round:before {
  content: "\f121";
}

.ion-chevron-down:before {
  content: "\f123";
}

.ion-chevron-left:before {
  content: "\f124";
}

.ion-chevron-right:before {
  content: "\f125";
}

.ion-chevron-up:before {
  content: "\f126";
}

.ion-clipboard:before {
  content: "\f127";
}

.ion-clock:before {
  content: "\f26e";
}

.ion-close:before {
  content: "\f12a";
}

.ion-close-circled:before {
  content: "\f128";
}

.ion-close-round:before {
  content: "\f129";
}

.ion-closed-captioning:before {
  content: "\f317";
}

.ion-cloud:before {
  content: "\f12b";
}

.ion-code:before {
  content: "\f271";
}

.ion-code-download:before {
  content: "\f26f";
}

.ion-code-working:before {
  content: "\f270";
}

.ion-coffee:before {
  content: "\f272";
}

.ion-compass:before {
  content: "\f273";
}

.ion-compose:before {
  content: "\f12c";
}

.ion-connection-bars:before {
  content: "\f274";
}

.ion-contrast:before {
  content: "\f275";
}

.ion-crop:before {
  content: "\f3c1";
}

.ion-cube:before {
  content: "\f318";
}

.ion-disc:before {
  content: "\f12d";
}

.ion-document:before {
  content: "\f12f";
}

.ion-document-text:before {
  content: "\f12e";
}

.ion-drag:before {
  content: "\f130";
}

.ion-earth:before {
  content: "\f276";
}

.ion-easel:before {
  content: "\f3c2";
}

.ion-edit:before {
  content: "\f2bf";
}

.ion-egg:before {
  content: "\f277";
}

.ion-eject:before {
  content: "\f131";
}

.ion-email:before {
  content: "\f132";
}

.ion-email-unread:before {
  content: "\f3c3";
}

.ion-erlenmeyer-flask:before {
  content: "\f3c5";
}

.ion-erlenmeyer-flask-bubbles:before {
  content: "\f3c4";
}

.ion-eye:before {
  content: "\f133";
}

.ion-eye-disabled:before {
  content: "\f306";
}

.ion-female:before {
  content: "\f278";
}

.ion-filing:before {
  content: "\f134";
}

.ion-film-marker:before {
  content: "\f135";
}

.ion-fireball:before {
  content: "\f319";
}

.ion-flag:before {
  content: "\f279";
}

.ion-flame:before {
  content: "\f31a";
}

.ion-flash:before {
  content: "\f137";
}

.ion-flash-off:before {
  content: "\f136";
}

.ion-folder:before {
  content: "\f139";
}

.ion-fork:before {
  content: "\f27a";
}

.ion-fork-repo:before {
  content: "\f2c0";
}

.ion-forward:before {
  content: "\f13a";
}

.ion-funnel:before {
  content: "\f31b";
}

.ion-gear-a:before {
  content: "\f13d";
}

.ion-gear-b:before {
  content: "\f13e";
}

.ion-grid:before {
  content: "\f13f";
}

.ion-hammer:before {
  content: "\f27b";
}

.ion-happy:before {
  content: "\f31c";
}

.ion-happy-outline:before {
  content: "\f3c6";
}

.ion-headphone:before {
  content: "\f140";
}

.ion-heart:before {
  content: "\f141";
}

.ion-heart-broken:before {
  content: "\f31d";
}

.ion-help:before {
  content: "\f143";
}

.ion-help-buoy:before {
  content: "\f27c";
}

.ion-help-circled:before {
  content: "\f142";
}

.ion-home:before {
  content: "\f144";
}

.ion-icecream:before {
  content: "\f27d";
}

.ion-image:before {
  content: "\f147";
}

.ion-images:before {
  content: "\f148";
}

.ion-information:before {
  content: "\f14a";
}

.ion-information-circled:before {
  content: "\f149";
}

.ion-ionic:before {
  content: "\f14b";
}

.ion-ios-alarm:before {
  content: "\f3c8";
}

.ion-ios-alarm-outline:before {
  content: "\f3c7";
}

.ion-ios-albums:before {
  content: "\f3ca";
}

.ion-ios-albums-outline:before {
  content: "\f3c9";
}

.ion-ios-americanfootball:before {
  content: "\f3cc";
}

.ion-ios-americanfootball-outline:before {
  content: "\f3cb";
}

.ion-ios-analytics:before {
  content: "\f3ce";
}

.ion-ios-analytics-outline:before {
  content: "\f3cd";
}

.ion-ios-arrow-back:before {
  content: "\f3cf";
}

.ion-ios-arrow-down:before {
  content: "\f3d0";
}

.ion-ios-arrow-forward:before {
  content: "\f3d1";
}

.ion-ios-arrow-left:before {
  content: "\f3d2";
}

.ion-ios-arrow-right:before {
  content: "\f3d3";
}

.ion-ios-arrow-thin-down:before {
  content: "\f3d4";
}

.ion-ios-arrow-thin-left:before {
  content: "\f3d5";
}

.ion-ios-arrow-thin-right:before {
  content: "\f3d6";
}

.ion-ios-arrow-thin-up:before {
  content: "\f3d7";
}

.ion-ios-arrow-up:before {
  content: "\f3d8";
}

.ion-ios-at:before {
  content: "\f3da";
}

.ion-ios-at-outline:before {
  content: "\f3d9";
}

.ion-ios-barcode:before {
  content: "\f3dc";
}

.ion-ios-barcode-outline:before {
  content: "\f3db";
}

.ion-ios-baseball:before {
  content: "\f3de";
}

.ion-ios-baseball-outline:before {
  content: "\f3dd";
}

.ion-ios-basketball:before {
  content: "\f3e0";
}

.ion-ios-basketball-outline:before {
  content: "\f3df";
}

.ion-ios-bell:before {
  content: "\f3e2";
}

.ion-ios-bell-outline:before {
  content: "\f3e1";
}

.ion-ios-body:before {
  content: "\f3e4";
}

.ion-ios-body-outline:before {
  content: "\f3e3";
}

.ion-ios-bolt:before {
  content: "\f3e6";
}

.ion-ios-bolt-outline:before {
  content: "\f3e5";
}

.ion-ios-book:before {
  content: "\f3e8";
}

.ion-ios-book-outline:before {
  content: "\f3e7";
}

.ion-ios-bookmarks:before {
  content: "\f3ea";
}

.ion-ios-bookmarks-outline:before {
  content: "\f3e9";
}

.ion-ios-box:before {
  content: "\f3ec";
}

.ion-ios-box-outline:before {
  content: "\f3eb";
}

.ion-ios-briefcase:before {
  content: "\f3ee";
}

.ion-ios-briefcase-outline:before {
  content: "\f3ed";
}

.ion-ios-browsers:before {
  content: "\f3f0";
}

.ion-ios-browsers-outline:before {
  content: "\f3ef";
}

.ion-ios-calculator:before {
  content: "\f3f2";
}

.ion-ios-calculator-outline:before {
  content: "\f3f1";
}

.ion-ios-calendar:before {
  content: "\f3f4";
}

.ion-ios-calendar-outline:before {
  content: "\f3f3";
}

.ion-ios-camera:before {
  content: "\f3f6";
}

.ion-ios-camera-outline:before {
  content: "\f3f5";
}

.ion-ios-cart:before {
  content: "\f3f8";
}

.ion-ios-cart-outline:before {
  content: "\f3f7";
}

.ion-ios-chatboxes:before {
  content: "\f3fa";
}

.ion-ios-chatboxes-outline:before {
  content: "\f3f9";
}

.ion-ios-chatbubble:before {
  content: "\f3fc";
}

.ion-ios-chatbubble-outline:before {
  content: "\f3fb";
}

.ion-ios-checkmark:before {
  content: "\f3ff";
}

.ion-ios-checkmark-empty:before {
  content: "\f3fd";
}

.ion-ios-checkmark-outline:before {
  content: "\f3fe";
}

.ion-ios-circle-filled:before {
  content: "\f400";
}

.ion-ios-circle-outline:before {
  content: "\f401";
}

.ion-ios-clock:before {
  content: "\f403";
}

.ion-ios-clock-outline:before {
  content: "\f402";
}

.ion-ios-close:before {
  content: "\f406";
}

.ion-ios-close-empty:before {
  content: "\f404";
}

.ion-ios-close-outline:before {
  content: "\f405";
}

.ion-ios-cloud:before {
  content: "\f40c";
}

.ion-ios-cloud-download:before {
  content: "\f408";
}

.ion-ios-cloud-download-outline:before {
  content: "\f407";
}

.ion-ios-cloud-outline:before {
  content: "\f409";
}

.ion-ios-cloud-upload:before {
  content: "\f40b";
}

.ion-ios-cloud-upload-outline:before {
  content: "\f40a";
}

.ion-ios-cloudy:before {
  content: "\f410";
}

.ion-ios-cloudy-night:before {
  content: "\f40e";
}

.ion-ios-cloudy-night-outline:before {
  content: "\f40d";
}

.ion-ios-cloudy-outline:before {
  content: "\f40f";
}

.ion-ios-cog:before {
  content: "\f412";
}

.ion-ios-cog-outline:before {
  content: "\f411";
}

.ion-ios-color-filter:before {
  content: "\f414";
}

.ion-ios-color-filter-outline:before {
  content: "\f413";
}

.ion-ios-color-wand:before {
  content: "\f416";
}

.ion-ios-color-wand-outline:before {
  content: "\f415";
}

.ion-ios-compose:before {
  content: "\f418";
}

.ion-ios-compose-outline:before {
  content: "\f417";
}

.ion-ios-contact:before {
  content: "\f41a";
}

.ion-ios-contact-outline:before {
  content: "\f419";
}

.ion-ios-copy:before {
  content: "\f41c";
}

.ion-ios-copy-outline:before {
  content: "\f41b";
}

.ion-ios-crop:before {
  content: "\f41e";
}

.ion-ios-crop-strong:before {
  content: "\f41d";
}

.ion-ios-download:before {
  content: "\f420";
}

.ion-ios-download-outline:before {
  content: "\f41f";
}

.ion-ios-drag:before {
  content: "\f421";
}

.ion-ios-email:before {
  content: "\f423";
}

.ion-ios-email-outline:before {
  content: "\f422";
}

.ion-ios-eye:before {
  content: "\f425";
}

.ion-ios-eye-outline:before {
  content: "\f424";
}

.ion-ios-fastforward:before {
  content: "\f427";
}

.ion-ios-fastforward-outline:before {
  content: "\f426";
}

.ion-ios-filing:before {
  content: "\f429";
}

.ion-ios-filing-outline:before {
  content: "\f428";
}

.ion-ios-film:before {
  content: "\f42b";
}

.ion-ios-film-outline:before {
  content: "\f42a";
}

.ion-ios-flag:before {
  content: "\f42d";
}

.ion-ios-flag-outline:before {
  content: "\f42c";
}

.ion-ios-flame:before {
  content: "\f42f";
}

.ion-ios-flame-outline:before {
  content: "\f42e";
}

.ion-ios-flask:before {
  content: "\f431";
}

.ion-ios-flask-outline:before {
  content: "\f430";
}

.ion-ios-flower:before {
  content: "\f433";
}

.ion-ios-flower-outline:before {
  content: "\f432";
}

.ion-ios-folder:before {
  content: "\f435";
}

.ion-ios-folder-outline:before {
  content: "\f434";
}

.ion-ios-football:before {
  content: "\f437";
}

.ion-ios-football-outline:before {
  content: "\f436";
}

.ion-ios-game-controller-a:before {
  content: "\f439";
}

.ion-ios-game-controller-a-outline:before {
  content: "\f438";
}

.ion-ios-game-controller-b:before {
  content: "\f43b";
}

.ion-ios-game-controller-b-outline:before {
  content: "\f43a";
}

.ion-ios-gear:before {
  content: "\f43d";
}

.ion-ios-gear-outline:before {
  content: "\f43c";
}

.ion-ios-glasses:before {
  content: "\f43f";
}

.ion-ios-glasses-outline:before {
  content: "\f43e";
}

.ion-ios-grid-view:before {
  content: "\f441";
}

.ion-ios-grid-view-outline:before {
  content: "\f440";
}

.ion-ios-heart:before {
  content: "\f443";
}

.ion-ios-heart-outline:before {
  content: "\f442";
}

.ion-ios-help:before {
  content: "\f446";
}

.ion-ios-help-empty:before {
  content: "\f444";
}

.ion-ios-help-outline:before {
  content: "\f445";
}

.ion-ios-home:before {
  content: "\f448";
}

.ion-ios-home-outline:before {
  content: "\f447";
}

.ion-ios-infinite:before {
  content: "\f44a";
}

.ion-ios-infinite-outline:before {
  content: "\f449";
}

.ion-ios-information:before {
  content: "\f44d";
}

.ion-ios-information-empty:before {
  content: "\f44b";
}

.ion-ios-information-outline:before {
  content: "\f44c";
}

.ion-ios-ionic-outline:before {
  content: "\f44e";
}

.ion-ios-keypad:before {
  content: "\f450";
}

.ion-ios-keypad-outline:before {
  content: "\f44f";
}

.ion-ios-lightbulb:before {
  content: "\f452";
}

.ion-ios-lightbulb-outline:before {
  content: "\f451";
}

.ion-ios-list:before {
  content: "\f454";
}

.ion-ios-list-outline:before {
  content: "\f453";
}

.ion-ios-location:before {
  content: "\f456";
}

.ion-ios-location-outline:before {
  content: "\f455";
}

.ion-ios-locked:before {
  content: "\f458";
}

.ion-ios-locked-outline:before {
  content: "\f457";
}

.ion-ios-loop:before {
  content: "\f45a";
}

.ion-ios-loop-strong:before {
  content: "\f459";
}

.ion-ios-medical:before {
  content: "\f45c";
}

.ion-ios-medical-outline:before {
  content: "\f45b";
}

.ion-ios-medkit:before {
  content: "\f45e";
}

.ion-ios-medkit-outline:before {
  content: "\f45d";
}

.ion-ios-mic:before {
  content: "\f461";
}

.ion-ios-mic-off:before {
  content: "\f45f";
}

.ion-ios-mic-outline:before {
  content: "\f460";
}

.ion-ios-minus:before {
  content: "\f464";
}

.ion-ios-minus-empty:before {
  content: "\f462";
}

.ion-ios-minus-outline:before {
  content: "\f463";
}

.ion-ios-monitor:before {
  content: "\f466";
}

.ion-ios-monitor-outline:before {
  content: "\f465";
}

.ion-ios-moon:before {
  content: "\f468";
}

.ion-ios-moon-outline:before {
  content: "\f467";
}

.ion-ios-more:before {
  content: "\f46a";
}

.ion-ios-more-outline:before {
  content: "\f469";
}

.ion-ios-musical-note:before {
  content: "\f46b";
}

.ion-ios-musical-notes:before {
  content: "\f46c";
}

.ion-ios-navigate:before {
  content: "\f46e";
}

.ion-ios-navigate-outline:before {
  content: "\f46d";
}

.ion-ios-nutrition:before {
  content: "\f470";
}

.ion-ios-nutrition-outline:before {
  content: "\f46f";
}

.ion-ios-paper:before {
  content: "\f472";
}

.ion-ios-paper-outline:before {
  content: "\f471";
}

.ion-ios-paperplane:before {
  content: "\f474";
}

.ion-ios-paperplane-outline:before {
  content: "\f473";
}

.ion-ios-partlysunny:before {
  content: "\f476";
}

.ion-ios-partlysunny-outline:before {
  content: "\f475";
}

.ion-ios-pause:before {
  content: "\f478";
}

.ion-ios-pause-outline:before {
  content: "\f477";
}

.ion-ios-paw:before {
  content: "\f47a";
}

.ion-ios-paw-outline:before {
  content: "\f479";
}

.ion-ios-people:before {
  content: "\f47c";
}

.ion-ios-people-outline:before {
  content: "\f47b";
}

.ion-ios-person:before {
  content: "\f47e";
}

.ion-ios-person-outline:before {
  content: "\f47d";
}

.ion-ios-personadd:before {
  content: "\f480";
}

.ion-ios-personadd-outline:before {
  content: "\f47f";
}

.ion-ios-photos:before {
  content: "\f482";
}

.ion-ios-photos-outline:before {
  content: "\f481";
}

.ion-ios-pie:before {
  content: "\f484";
}

.ion-ios-pie-outline:before {
  content: "\f483";
}

.ion-ios-pint:before {
  content: "\f486";
}

.ion-ios-pint-outline:before {
  content: "\f485";
}

.ion-ios-play:before {
  content: "\f488";
}

.ion-ios-play-outline:before {
  content: "\f487";
}

.ion-ios-plus:before {
  content: "\f48b";
}

.ion-ios-plus-empty:before {
  content: "\f489";
}

.ion-ios-plus-outline:before {
  content: "\f48a";
}

.ion-ios-pricetag:before {
  content: "\f48d";
}

.ion-ios-pricetag-outline:before {
  content: "\f48c";
}

.ion-ios-pricetags:before {
  content: "\f48f";
}

.ion-ios-pricetags-outline:before {
  content: "\f48e";
}

.ion-ios-printer:before {
  content: "\f491";
}

.ion-ios-printer-outline:before {
  content: "\f490";
}

.ion-ios-pulse:before {
  content: "\f493";
}

.ion-ios-pulse-strong:before {
  content: "\f492";
}

.ion-ios-rainy:before {
  content: "\f495";
}

.ion-ios-rainy-outline:before {
  content: "\f494";
}

.ion-ios-recording:before {
  content: "\f497";
}

.ion-ios-recording-outline:before {
  content: "\f496";
}

.ion-ios-redo:before {
  content: "\f499";
}

.ion-ios-redo-outline:before {
  content: "\f498";
}

.ion-ios-refresh:before {
  content: "\f49c";
}

.ion-ios-refresh-empty:before {
  content: "\f49a";
}

.ion-ios-refresh-outline:before {
  content: "\f49b";
}

.ion-ios-reload:before {
  content: "\f49d";
}

.ion-ios-reverse-camera:before {
  content: "\f49f";
}

.ion-ios-reverse-camera-outline:before {
  content: "\f49e";
}

.ion-ios-rewind:before {
  content: "\f4a1";
}

.ion-ios-rewind-outline:before {
  content: "\f4a0";
}

.ion-ios-rose:before {
  content: "\f4a3";
}

.ion-ios-rose-outline:before {
  content: "\f4a2";
}

.ion-ios-search:before {
  content: "\f4a5";
}

.ion-ios-search-strong:before {
  content: "\f4a4";
}

.ion-ios-settings:before {
  content: "\f4a7";
}

.ion-ios-settings-strong:before {
  content: "\f4a6";
}

.ion-ios-shuffle:before {
  content: "\f4a9";
}

.ion-ios-shuffle-strong:before {
  content: "\f4a8";
}

.ion-ios-skipbackward:before {
  content: "\f4ab";
}

.ion-ios-skipbackward-outline:before {
  content: "\f4aa";
}

.ion-ios-skipforward:before {
  content: "\f4ad";
}

.ion-ios-skipforward-outline:before {
  content: "\f4ac";
}

.ion-ios-snowy:before {
  content: "\f4ae";
}

.ion-ios-speedometer:before {
  content: "\f4b0";
}

.ion-ios-speedometer-outline:before {
  content: "\f4af";
}

.ion-ios-star:before {
  content: "\f4b3";
}

.ion-ios-star-half:before {
  content: "\f4b1";
}

.ion-ios-star-outline:before {
  content: "\f4b2";
}

.ion-ios-stopwatch:before {
  content: "\f4b5";
}

.ion-ios-stopwatch-outline:before {
  content: "\f4b4";
}

.ion-ios-sunny:before {
  content: "\f4b7";
}

.ion-ios-sunny-outline:before {
  content: "\f4b6";
}

.ion-ios-telephone:before {
  content: "\f4b9";
}

.ion-ios-telephone-outline:before {
  content: "\f4b8";
}

.ion-ios-tennisball:before {
  content: "\f4bb";
}

.ion-ios-tennisball-outline:before {
  content: "\f4ba";
}

.ion-ios-thunderstorm:before {
  content: "\f4bd";
}

.ion-ios-thunderstorm-outline:before {
  content: "\f4bc";
}

.ion-ios-time:before {
  content: "\f4bf";
}

.ion-ios-time-outline:before {
  content: "\f4be";
}

.ion-ios-timer:before {
  content: "\f4c1";
}

.ion-ios-timer-outline:before {
  content: "\f4c0";
}

.ion-ios-toggle:before {
  content: "\f4c3";
}

.ion-ios-toggle-outline:before {
  content: "\f4c2";
}

.ion-ios-trash:before {
  content: "\f4c5";
}

.ion-ios-trash-outline:before {
  content: "\f4c4";
}

.ion-ios-undo:before {
  content: "\f4c7";
}

.ion-ios-undo-outline:before {
  content: "\f4c6";
}

.ion-ios-unlocked:before {
  content: "\f4c9";
}

.ion-ios-unlocked-outline:before {
  content: "\f4c8";
}

.ion-ios-upload:before {
  content: "\f4cb";
}

.ion-ios-upload-outline:before {
  content: "\f4ca";
}

.ion-ios-videocam:before {
  content: "\f4cd";
}

.ion-ios-videocam-outline:before {
  content: "\f4cc";
}

.ion-ios-volume-high:before {
  content: "\f4ce";
}

.ion-ios-volume-low:before {
  content: "\f4cf";
}

.ion-ios-wineglass:before {
  content: "\f4d1";
}

.ion-ios-wineglass-outline:before {
  content: "\f4d0";
}

.ion-ios-world:before {
  content: "\f4d3";
}

.ion-ios-world-outline:before {
  content: "\f4d2";
}

.ion-ipad:before {
  content: "\f1f9";
}

.ion-iphone:before {
  content: "\f1fa";
}

.ion-ipod:before {
  content: "\f1fb";
}

.ion-jet:before {
  content: "\f295";
}

.ion-key:before {
  content: "\f296";
}

.ion-knife:before {
  content: "\f297";
}

.ion-laptop:before {
  content: "\f1fc";
}

.ion-leaf:before {
  content: "\f1fd";
}

.ion-levels:before {
  content: "\f298";
}

.ion-lightbulb:before {
  content: "\f299";
}

.ion-link:before {
  content: "\f1fe";
}

.ion-load-a:before {
  content: "\f29a";
}

.ion-load-b:before {
  content: "\f29b";
}

.ion-load-c:before {
  content: "\f29c";
}

.ion-load-d:before {
  content: "\f29d";
}

.ion-location:before {
  content: "\f1ff";
}

.ion-lock-combination:before {
  content: "\f4d4";
}

.ion-locked:before {
  content: "\f200";
}

.ion-log-in:before {
  content: "\f29e";
}

.ion-log-out:before {
  content: "\f29f";
}

.ion-loop:before {
  content: "\f201";
}

.ion-magnet:before {
  content: "\f2a0";
}

.ion-male:before {
  content: "\f2a1";
}

.ion-man:before {
  content: "\f202";
}

.ion-map:before {
  content: "\f203";
}

.ion-medkit:before {
  content: "\f2a2";
}

.ion-merge:before {
  content: "\f33f";
}

.ion-mic-a:before {
  content: "\f204";
}

.ion-mic-b:before {
  content: "\f205";
}

.ion-mic-c:before {
  content: "\f206";
}

.ion-minus:before {
  content: "\f209";
}

.ion-minus-circled:before {
  content: "\f207";
}

.ion-minus-round:before {
  content: "\f208";
}

.ion-model-s:before {
  content: "\f2c1";
}

.ion-monitor:before {
  content: "\f20a";
}

.ion-more:before {
  content: "\f20b";
}

.ion-mouse:before {
  content: "\f340";
}

.ion-music-note:before {
  content: "\f20c";
}

.ion-navicon:before {
  content: "\f20e";
}

.ion-navicon-round:before {
  content: "\f20d";
}

.ion-navigate:before {
  content: "\f2a3";
}

.ion-network:before {
  content: "\f341";
}

.ion-no-smoking:before {
  content: "\f2c2";
}

.ion-nuclear:before {
  content: "\f2a4";
}

.ion-outlet:before {
  content: "\f342";
}

.ion-paintbrush:before {
  content: "\f4d5";
}

.ion-paintbucket:before {
  content: "\f4d6";
}

.ion-paper-airplane:before {
  content: "\f2c3";
}

.ion-paperclip:before {
  content: "\f20f";
}

.ion-pause:before {
  content: "\f210";
}

.ion-person:before {
  content: "\f213";
}

.ion-person-add:before {
  content: "\f211";
}

.ion-person-stalker:before {
  content: "\f212";
}

.ion-pie-graph:before {
  content: "\f2a5";
}

.ion-pin:before {
  content: "\f2a6";
}

.ion-pinpoint:before {
  content: "\f2a7";
}

.ion-pizza:before {
  content: "\f2a8";
}

.ion-plane:before {
  content: "\f214";
}

.ion-planet:before {
  content: "\f343";
}

.ion-play:before {
  content: "\f215";
}

.ion-playstation:before {
  content: "\f30a";
}

.ion-plus:before {
  content: "\f218";
}

.ion-plus-circled:before {
  content: "\f216";
}

.ion-plus-round:before {
  content: "\f217";
}

.ion-podium:before {
  content: "\f344";
}

.ion-pound:before {
  content: "\f219";
}

.ion-power:before {
  content: "\f2a9";
}

.ion-pricetag:before {
  content: "\f2aa";
}

.ion-pricetags:before {
  content: "\f2ab";
}

.ion-printer:before {
  content: "\f21a";
}

.ion-pull-request:before {
  content: "\f345";
}

.ion-qr-scanner:before {
  content: "\f346";
}

.ion-quote:before {
  content: "\f347";
}

.ion-radio-waves:before {
  content: "\f2ac";
}

.ion-record:before {
  content: "\f21b";
}

.ion-refresh:before {
  content: "\f21c";
}

.ion-reply:before {
  content: "\f21e";
}

.ion-reply-all:before {
  content: "\f21d";
}

.ion-ribbon-a:before {
  content: "\f348";
}

.ion-ribbon-b:before {
  content: "\f349";
}

.ion-sad:before {
  content: "\f34a";
}

.ion-sad-outline:before {
  content: "\f4d7";
}

.ion-scissors:before {
  content: "\f34b";
}

.ion-search:before {
  content: "\f21f";
}

.ion-settings:before {
  content: "\f2ad";
}

.ion-share:before {
  content: "\f220";
}

.ion-shuffle:before {
  content: "\f221";
}

.ion-skip-backward:before {
  content: "\f222";
}

.ion-skip-forward:before {
  content: "\f223";
}

.ion-social-android:before {
  content: "\f225";
}

.ion-social-android-outline:before {
  content: "\f224";
}

.ion-social-angular:before {
  content: "\f4d9";
}

.ion-social-angular-outline:before {
  content: "\f4d8";
}

.ion-social-apple:before {
  content: "\f227";
}

.ion-social-apple-outline:before {
  content: "\f226";
}

.ion-social-bitcoin:before {
  content: "\f2af";
}

.ion-social-bitcoin-outline:before {
  content: "\f2ae";
}

.ion-social-buffer:before {
  content: "\f229";
}

.ion-social-buffer-outline:before {
  content: "\f228";
}

.ion-social-chrome:before {
  content: "\f4db";
}

.ion-social-chrome-outline:before {
  content: "\f4da";
}

.ion-social-codepen:before {
  content: "\f4dd";
}

.ion-social-codepen-outline:before {
  content: "\f4dc";
}

.ion-social-css3:before {
  content: "\f4df";
}

.ion-social-css3-outline:before {
  content: "\f4de";
}

.ion-social-designernews:before {
  content: "\f22b";
}

.ion-social-designernews-outline:before {
  content: "\f22a";
}

.ion-social-dribbble:before {
  content: "\f22d";
}

.ion-social-dribbble-outline:before {
  content: "\f22c";
}

.ion-social-dropbox:before {
  content: "\f22f";
}

.ion-social-dropbox-outline:before {
  content: "\f22e";
}

.ion-social-euro:before {
  content: "\f4e1";
}

.ion-social-euro-outline:before {
  content: "\f4e0";
}

.ion-social-facebook:before {
  content: "\f231";
}

.ion-social-facebook-outline:before {
  content: "\f230";
}

.ion-social-foursquare:before {
  content: "\f34d";
}

.ion-social-foursquare-outline:before {
  content: "\f34c";
}

.ion-social-freebsd-devil:before {
  content: "\f2c4";
}

.ion-social-github:before {
  content: "\f233";
}

.ion-social-github-outline:before {
  content: "\f232";
}

.ion-social-google:before {
  content: "\f34f";
}

.ion-social-google-outline:before {
  content: "\f34e";
}

.ion-social-googleplus:before {
  content: "\f235";
}

.ion-social-googleplus-outline:before {
  content: "\f234";
}

.ion-social-hackernews:before {
  content: "\f237";
}

.ion-social-hackernews-outline:before {
  content: "\f236";
}

.ion-social-html5:before {
  content: "\f4e3";
}

.ion-social-html5-outline:before {
  content: "\f4e2";
}

.ion-social-instagram:before {
  content: "\f351";
}

.ion-social-instagram-outline:before {
  content: "\f350";
}

.ion-social-javascript:before {
  content: "\f4e5";
}

.ion-social-javascript-outline:before {
  content: "\f4e4";
}

.ion-social-linkedin:before {
  content: "\f239";
}

.ion-social-linkedin-outline:before {
  content: "\f238";
}

.ion-social-markdown:before {
  content: "\f4e6";
}

.ion-social-nodejs:before {
  content: "\f4e7";
}

.ion-social-octocat:before {
  content: "\f4e8";
}

.ion-social-pinterest:before {
  content: "\f2b1";
}

.ion-social-pinterest-outline:before {
  content: "\f2b0";
}

.ion-social-python:before {
  content: "\f4e9";
}

.ion-social-reddit:before {
  content: "\f23b";
}

.ion-social-reddit-outline:before {
  content: "\f23a";
}

.ion-social-rss:before {
  content: "\f23d";
}

.ion-social-rss-outline:before {
  content: "\f23c";
}

.ion-social-sass:before {
  content: "\f4ea";
}

.ion-social-skype:before {
  content: "\f23f";
}

.ion-social-skype-outline:before {
  content: "\f23e";
}

.ion-social-snapchat:before {
  content: "\f4ec";
}

.ion-social-snapchat-outline:before {
  content: "\f4eb";
}

.ion-social-tumblr:before {
  content: "\f241";
}

.ion-social-tumblr-outline:before {
  content: "\f240";
}

.ion-social-tux:before {
  content: "\f2c5";
}

.ion-social-twitch:before {
  content: "\f4ee";
}

.ion-social-twitch-outline:before {
  content: "\f4ed";
}

.ion-social-twitter:before {
  content: "\f243";
}

.ion-social-twitter-outline:before {
  content: "\f242";
}

.ion-social-usd:before {
  content: "\f353";
}

.ion-social-usd-outline:before {
  content: "\f352";
}

.ion-social-vimeo:before {
  content: "\f245";
}

.ion-social-vimeo-outline:before {
  content: "\f244";
}

.ion-social-whatsapp:before {
  content: "\f4f0";
}

.ion-social-whatsapp-outline:before {
  content: "\f4ef";
}

.ion-social-windows:before {
  content: "\f247";
}

.ion-social-windows-outline:before {
  content: "\f246";
}

.ion-social-wordpress:before {
  content: "\f249";
}

.ion-social-wordpress-outline:before {
  content: "\f248";
}

.ion-social-yahoo:before {
  content: "\f24b";
}

.ion-social-yahoo-outline:before {
  content: "\f24a";
}

.ion-social-yen:before {
  content: "\f4f2";
}

.ion-social-yen-outline:before {
  content: "\f4f1";
}

.ion-social-youtube:before {
  content: "\f24d";
}

.ion-social-youtube-outline:before {
  content: "\f24c";
}

.ion-soup-can:before {
  content: "\f4f4";
}

.ion-soup-can-outline:before {
  content: "\f4f3";
}

.ion-speakerphone:before {
  content: "\f2b2";
}

.ion-speedometer:before {
  content: "\f2b3";
}

.ion-spoon:before {
  content: "\f2b4";
}

.ion-star:before {
  content: "\f24e";
}

.ion-stats-bars:before {
  content: "\f2b5";
}

.ion-steam:before {
  content: "\f30b";
}

.ion-stop:before {
  content: "\f24f";
}

.ion-thermometer:before {
  content: "\f2b6";
}

.ion-thumbsdown:before {
  content: "\f250";
}

.ion-thumbsup:before {
  content: "\f251";
}

.ion-toggle:before {
  content: "\f355";
}

.ion-toggle-filled:before {
  content: "\f354";
}

.ion-transgender:before {
  content: "\f4f5";
}

.ion-trash-a:before {
  content: "\f252";
}

.ion-trash-b:before {
  content: "\f253";
}

.ion-trophy:before {
  content: "\f356";
}

.ion-tshirt:before {
  content: "\f4f7";
}

.ion-tshirt-outline:before {
  content: "\f4f6";
}

.ion-umbrella:before {
  content: "\f2b7";
}

.ion-university:before {
  content: "\f357";
}

.ion-unlocked:before {
  content: "\f254";
}

.ion-upload:before {
  content: "\f255";
}

.ion-usb:before {
  content: "\f2b8";
}

.ion-videocamera:before {
  content: "\f256";
}

.ion-volume-high:before {
  content: "\f257";
}

.ion-volume-low:before {
  content: "\f258";
}

.ion-volume-medium:before {
  content: "\f259";
}

.ion-volume-mute:before {
  content: "\f25a";
}

.ion-wand:before {
  content: "\f358";
}

.ion-waterdrop:before {
  content: "\f25b";
}

.ion-wifi:before {
  content: "\f25c";
}

.ion-wineglass:before {
  content: "\f2b9";
}

.ion-woman:before {
  content: "\f25d";
}

.ion-wrench:before {
  content: "\f2ba";
}

.ion-xbox:before {
  content: "\f30c";
}

@font-face {
  font-family: "icomoon";
  src: url("../fonts/icomoon.eot?-acvnf3");
  src: url("../fonts/icomoon.eot?#iefix-acvnf3") format("embedded-opentype"), url("../fonts/icomoon.woff?-acvnf3") format("woff"), url("../fonts/icomoon.ttf?-acvnf3") format("truetype"), url("../fonts/icomoon.svg?-acvnf3#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^=icon-], [class*=" icon-"] {
  font-family: "icomoon";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-barcode:before {
  content: "\e600";
  font-size: 100%;
  margin-top: 0px;
  display: inline-block;
}

.icon-qrcode:before {
  content: "\e601";
}

.icon-disk:before {
  content: "\e602";
  font-size: 78%;
  margin-top: 12px;
  display: inline-block;
}

.spin::before {
  NO-line-height: 100px;
  -webkit-animation: spin 1s infinite linear;
  -moz-animation: spin 1s infinite linear;
  -ms-animation: spin 1s infinite linear;
  -o-animation: spin 1s infinite linear;
  animation: spin 1s infinite linear;
}

@keyframes "spin" {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -ms-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes "spin" {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-ms-keyframes "spin" {
  from {
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-o-keyframes "spin" {
  from {
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -o-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/*
*   Ionic "emotional" colors
*   ver: http://ionicframework.com/docs/components/#colors
*/
.light, a.light {
  color: #fff;
}

.light-bg {
  background-color: #fff;
}

.light-border {
  border-color: #ddd;
}

.ultrastable-bg {
  background-color: #eeeeee;
}

.stable, .ionic a.stable {
  color: #f8f8f8;
}

.stable-bg {
  background-color: #ababab;
}

/* #ddd; #f8f8f8; */
.stable-border {
  border-color: #b2b2b2;
}

.positive, a.positive {
  color: #4a87ee;
}

.positive-bg {
  background-color: #4a87ee;
}

.positive-border {
  border-color: #145fd7;
}

.calm, a.calm {
  color: #43cee6;
}

.calm-bg {
  background-color: #43cee6;
}

.calm-border {
  border-color: #1aacc3;
}

.assertive, a.assertive {
  color: #ef4e3a;
}

.assertive-bg {
  background-color: #ef4e3a;
}

.assertive-border {
  border-color: #cc2311;
}

.balanced, a.balanced {
  color: #55ff00;
}

.balanced-bg {
  background-color: #66cc33;
}

.balanced-border {
  border-color: #498f24;
}

.energized, a.energized {
  color: #f0b840;
}

.energized-bg {
  background-color: #ff7c05;
  /* #f1aa00 #F0E040;*/
  /*#f0b840;*/
}

.energized-border {
  border-color: #d39211;
}

.royal, a.royal {
  color: #8a6de9;
}

.royal-bg {
  background-color: #D500FF;
  /*#8a6de9;*/
}

.royal-border {
  border-color: #552bdf;
}

.dark {
  color: #383838;
}

.dark-bg {
  background-color: #383838;
}

.dark-border {
  border-color: #111;
}

/*
*   State colors
*   indicate some state (warning, error, due, touched, etc ...)
*/
.due {
  color: #ff0000;
}

.touched {
  background: orange !important;
  color: #666 !important;
  opacity: 1;
}

em.E, .E {
  background-color: #ff9933 !important;
}

.ok {
  color: #00FF90 !important;
}

NO.error {
  color: #ff0011;
}

.warn {
  color: #ffdf5b;
}

.status {
  background-color: #EBEBEB;
  font-size: 12pt;
  margin: 0;
  padding: 2rem;
  margin-top: -20px;
}

/*
*   Notification colors
*/
.notice-error {
  background-color: #E91E63;
  color: #fff;
  border-radius: 4px;
}

.notice-ok {
  background-color: #8aff8a;
  border-radius: 4px;
}

.notice-warn {
  background-color: #f0b840;
}

/*
*   Action colors
*   Background of some buttones to indicate some action
*/
/*
*   Color corrections needed when some color
*   does not show well against a certain background
*/
.dark-bg {
  background-color: #000;
}
.dark-bg h1, .dark-bg .title {
  color: #fff;
}
.dark-bg h2, .dark-bg .subtitle {
  color: white;
}
.dark-bg h3, .dark-bg .alt-subtitle {
  color: white;
}
.dark-bg h4, .dark-bg .item-title {
  color: white;
}
.dark-bg h5, .dark-bg .item-alt-title {
  color: white;
}
.dark-bg p {
  color: white;
}
.dark-bg p.sp {
  color: white;
}
.dark-bg aside {
  color: #0084fd;
}
.dark-bg a {
  color: orange;
}

.energized-bg a,
.positive-bg a,
.royal-bg a {
  color: orange;
}

/*
 ** RESET STYLES **
*/
body, p, div, form, h1, h2, h3, h4, h5, ul, .content form .form-section > .form-row, .content form .form-section > .form-list, .content ul.content-grid.with-icons, .content ul.content-grid, li, table, img, tr, td, select, input, textarea, button {
  padding: 0px;
  margin: 0px;
  font-family: "Nunito Regular", "UI", "RobotoDraft", "Helvetica", "Arial", sans-serif;
  font-size: 100%;
}

table {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  width: 100%;
}

body {
  font-size: 11pt;
  background-color: #ededed;
  width: 100%;
}

ul, .content form .form-section > .form-row, .content form .form-section > .form-list, .content ul.content-grid.with-icons, .content ul.content-grid, ol {
  list-style: none;
}

fieldset {
  border: none;
  font-size: inherit;
}

/* Forced Invisibility status for an element */
.invisible {
  display: none;
  height: 0;
  width: 0;
}

/* Disable default bhvs - apply to all elems */
* {
  /* webkit */
  -webkit-text-size-adjust: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  /* MS */
  /* Disable touch behaviors, like pan and zoom */
  -ms-user-select: none;
}

input, textarea {
  /* OJO: si no se hace esto no andan los inputs ni textareas ! */
  -webkit-user-select: auto;
  -ms-user-select: auto;
}

/*
* END RESET 
*/
/*
*  COMPLEMENTARY STYLES
*  Estos estilos se usan para complementar o modificar
*  en forma local un estilo existente.
*/
/* indicate some element state */
.hidden {
  display: none !important;
}

.nobold {
  font-weight: normal;
}

/* locally change size of element */
.xsmaller {
  font-size: 0.7em;
}

.smaller {
  font-size: 0.8em !important;
}

.small {
  font-size: 0.9em;
}

.normal {
  font-size: 1em;
}

.medium {
  font-size: 1.15em !important;
}

.big {
  font-size: 1.3em !important;
}

.bigger {
  font-size: 1.4em;
}

.wide {
  width: 96%;
  display: block;
  margin: 0.2em auto;
}

/* alignments */
.center {
  text-align: center !important;
}

.right {
  text-align: right;
}

.left {
  text-align: left;
}

.float-right {
  float: right !important;
}

.float-left {
  float: left !important;
}

.float-clear {
  clear: both;
  float: none !important;
}

.indent {
  margin-left: 130px !important;
}

/* flush certain properties */
.flush {
  margin: 0;
  padding: 0px;
}

.no-font {
  color: #111;
  font-weight: normal;
  font-style: normal;
}

.no-margin {
  margin: 0;
}

.no-border {
  border: none !important;
}

.no-float {
  float: none !important;
}

.no-pad {
  padding: 0 !important;
}

/* apply additional decorations */
.glow {
  background-color: #00ff00;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#f1f1f1), to(#ddd));
}

.radius {
  border-radius: 5px;
}

.warning {
  padding: 0.5em;
  border-radius: 1em;
  color: #000 !important;
  background: #fefcea;
  /* Old browsers */
  background: -moz-linear-gradient(top, #fefcea 0%, #fafc6a 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fefcea), color-stop(100%, #fafc6a));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #fefcea 0%, #fafc6a 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #fefcea 0%, #fafc6a 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #fefcea 0%, #fafc6a 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #fefcea 0%, #fafc6a 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#fefcea", endColorstr="#fafc6a",GradientType=0 );
  /* IE6-9 */
}

.p-1 {
  padding: 0.8rem;
}

.p-2 {
  padding: 1.6rem;
}

/*
* 	_LAYOUT.SCSS
* 	Define los multiples layouts y la disposicion de los
*	distintos elementos en la pagina
*/
/*
*	Basic layout elements
*/
.page {
  position: absolute;
  display: none;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background-color: inherit;
}
.page.current {
  display: block;
}
.page .action-bar {
  margin: 0;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 20px;
  padding-bottom: 10px;
  position: relative;
}
.page .action-bar .tabs {
  font-size: 12pt;
}
.lt-480 .tabs {
  margin-left: 12px;
  margin-top: 0px;
}
.lt-480 .tabs a {
  display: inline-block;
  margin-left: 0;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 10px;
}
.lt-480 .tabs a::after {
  content: "";
}
.lt-480 h4 {
  margin-left: 10px;
}

.page .action-bar .actions-set {
  position: absolute;
  height: 42px;
  font-size: 24px;
  padding: 10px;
  padding-left: 0;
  padding-right: 20px;
  top: 30px;
  left: 0;
  right: 0;
  background-color: transparent;
  text-align: right;
  z-index: 3;
  color: #aaa;
}
.page .action-bar .actions-set > .back {
  float: left;
}
.page .action-bar .actions-set > .back.windows-8 {
  float: left;
}
.page .action-bar.initial .actions-set {
  position: absolute;
  top: 30px;
  background-color: transparent;
  padding-left: 20px;
}
.page .action-bar.initial .title {
  padding-left: 56px;
}
.page .action-bar.initial .title.no-margin {
  padding-left: 0;
}
.page .action-bar.middle .actions-set {
  position: fixed;
  top: 0px;
  background-color: transparent;
  padding-left: 20px;
}
.page .action-bar.middle .title {
  padding-left: 0;
}
.page .action-bar.final .actions-set {
  position: fixed;
  top: 0px;
  background-color: #ccc;
  opacity: 0.6;
  padding-left: 20px;
}
.page .action-bar.NO-elevated .actions-set {
  position: fixed;
  top: 0px;
  padding-left: 20px;
  background-color: #ccc;
  opacity: 1;
}
.page .content {
  margin: 0;
  padding: 0;
  background-color: inherit;
}
.page .content.blocked {
  background-color: #C3AB97;
}
.page .content .container {
  margin: 0;
  padding: 0;
  background-color: inherit;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 20px;
}
.page .content .container .section {
  margin: 0;
  padding: 0;
  background-color: inherit;
  display: none;
}
.page .content .container .section.current {
  display: block;
}
.page .filler {
  height: 100%;
}

.footer {
  padding: 10pt;
  text-align: center;
}
.footer > p {
  color: rgba(0, 0, 0, 0.9);
}
.footer.elevated {
  background-color: transparent;
  border-top: 1px solid #666;
  color: #000;
  width: 100%;
  margin: 0;
  padding: 20px 0;
  opacity: 1;
}

.overlay {
  display: block;
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: red;
  opacity: 0;
}

/*
*   END LAYOUT.CSS
*/
/*
*	Content elements
*/
/*
* 	Common content elements
*/
.title, h1 {
  font-family: "Nunito Regular";
  font-weight: 100;
  margin-top: 20px;
  margin-bottom: 10px;
  color: black;
  overflow: hidden;
  white-space: nowrap;
  font-size: 22pt;
}
.title .action-btn, .title .row-action-btn, .title .field-action-btn, h1 .action-btn, h1 .row-action-btn, h1 .field-action-btn {
  vertical-align: super;
  margin-right: 10px;
}
.gt-480 .form-list .title, .gt-480 .form-list h1 {
  font-size: 28pt;
}

.subtitle, h2 {
  font-family: "Nunito Light";
  font-size: 22pt;
  font-weight: normal;
  line-height: 140%;
  color: black;
  margin-bottom: 4pt;
}
.subtitle > em, h2 > em {
  float: right;
  margin-right: 20px;
  font-size: 1.1rem;
}

.alt-subtitle, h3 {
  font-family: "Nunito Light";
  font-size: 16pt;
  font-weight: normal;
  line-height: 140%;
  color: black;
}

.item-title, h4 {
  font-family: "Nunito Light";
  font-size: 12pt;
  font-weight: bold;
  line-height: 140%;
  color: black;
}
.item-title > i, h4 > i {
  font-size: 1.6em;
  vertical-align: sub;
}

.item-alt-title, h5 {
  font-family: "Nunito Light";
  font-size: 11pt;
  font-weight: normal;
  line-height: 140%;
  color: black;
}

.paragraph, p {
  font-family: "Nunito Regular";
  font-size: 1.1rem;
  color: rgba(0, 0, 0, 0.9);
  line-height: 140%;
}

.caption, .hint, p.sp {
  font-family: "Nunito Regular";
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
  line-height: 140%;
}

/*
*	Navigation and Link styles
*/
.nav, a, .link {
  cursor: pointer;
}
.nav.touched, a.touched, .touched.link {
  padding: 2pt;
  border-radius: 2pt;
}

a, .link {
  color: #ff5f40;
  font-family: "Nunito Regular";
  font-size: 1.2rem;
  font-weight: bold;
  text-decoration: none;
  padding-bottom: 2pt;
  border-bottom: 0px dotted #ff5f40;
}
h1.link, h2.link, h3.link {
  font-weight: normal;
}

/*
*	Content List styles
*	Used inside content areas
*/
.content ul, .content form .form-section > .form-row, .content form .form-section > .form-list, .content ul.content-grid.with-icons, .content ul.content-grid, .content ul.content-list {
  padding: 0;
  text-align: left;
}
.content ul > li, .content form .form-section > .form-row > li, .content form .form-section > .form-list > li, .content ul.content-grid.with-icons > li, .content ul.content-grid > li, .content ul.content-list > li {
  position: relative;
  margin-bottom: 20px;
  vertical-align: top;
  display: block;
}
.content ul > li .touched, .content form .form-section > .form-row > li .touched, .content form .form-section > .form-list > li .touched, .content ul.content-grid.with-icons > li .touched, .content ul.content-list > li .touched {
  padding: 2pt;
  border-radius: 2pt;
}
.content ul > li em, .content form .form-section > .form-row > li em, .content form .form-section > .form-list > li em, .content ul.content-grid.with-icons > li em, .content ul.content-grid > li em, .content ul.content-list > li em {
  font-size: 0.9rem;
  font-style: normal;
  border-radius: 2pt;
  background-color: #C3FFC3;
  color: rgba(0, 0, 0, 0.9);
  padding: 4pt;
  display: inline-block;
  position: absolute;
  top: 2pt;
  right: 10px;
  left: auto;
}
.content ul > li > p > i, .content form .form-section > .form-row > li > p > i, .content form .form-section > .form-list > li > p > i, .content ul.content-grid.with-icons > li > p > i, .content ul.content-grid > li > p > i, .content ul.content-list > li > p > i {
  font-size: 1.6em;
  vertical-align: sub;
}

.content ul.content-grid > li, .content form .form-section > .content-grid.form-row > li, .content form .form-section > .content-grid.form-list > li, .content ul.content-grid.with-icons > li {
  position: relative;
  margin: 0 20px 20px 0;
  display: inline-block;
  text-align: center;
  overflow: hidden;
  width: 240px;
}
.lt-480 .content ul.content-grid > li, .lt-480 .content form .form-section > .content-grid.form-row > li, .lt-480 .content form .form-section > .content-grid.form-list > li {
  width: 43%;
  max-width: 110px;
}

.content ul.content-grid > li > em, .content form .form-section > .content-grid.form-row > li > em, .content form .form-section > .content-grid.form-list > li > em, .content ul.content-grid.with-icons > li > em {
  position: relative;
  margin-bottom: 2px;
}
.content ul.content-grid.max-2-per-row li, .content form .form-section > .content-grid.max-2-per-row.form-row li, .content form .form-section > .content-grid.max-2-per-row.form-list li {
  width: 40%;
}
.content ul.content-grid.max-5-per-row li, .content form .form-section > .content-grid.max-5-per-row.form-row li, .content form .form-section > .content-grid.max-5-per-row.form-list li {
  width: 15%;
}

.content ul.content-grid.with-icons > li > em, .content form .form-section > .content-grid.with-icons.form-row > li > em, .content form .form-section > .content-grid.with-icons.form-list > li > em {
  display: inline-block;
  position: absolute;
  top: 22.4pt;
  left: 55%;
  right: auto;
  font-size: 0.8em;
}
.content ul.content-grid.with-icons > li > em.Activo, .content form .form-section > .content-grid.with-icons.form-row > li > em.Activo, .content form .form-section > .content-grid.with-icons.form-list > li > em.Activo {
  background-color: #87ff88;
}
.content ul.content-grid.with-icons > li > em.Inactivo, .content form .form-section > .content-grid.with-icons.form-row > li > em.Inactivo, .content form .form-section > .content-grid.with-icons.form-list > li > em.Inactivo {
  background-color: #e39040f6;
}
.content ul.content-grid.with-icons > li > em.Eliminado, .content form .form-section > .content-grid.with-icons.form-row > li > em.Eliminado, .content form .form-section > .content-grid.with-icons.form-list > li > em.Eliminado {
  background-color: #4f4f4f;
  color: #fff;
}
.content ul.content-grid.with-icons > li i.icon, .content form .form-section > .content-grid.with-icons.form-row > li i.icon, .content form .form-section > .content-grid.with-icons.form-list > li i.icon {
  font-size: 28pt;
  color: black;
}

/*
*	Tiled Grid and Tiles styles
*/
.tiled-grid {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  height: 700px;
}
.tiled-grid > .tile {
  text-align: left;
  opacity: 1;
  position: absolute;
  padding: 0;
  color: rgba(0, 0, 0, 0.9);
  overflow: hidden;
}
.tiled-grid > .tile > h1, .tiled-grid > .tile > h2, .tiled-grid > .tile > h3, .tiled-grid > .tile > h4, .tiled-grid > .tile > h5, .tiled-grid > .tile > ul, .content form .tiled-grid > .form-section.tile > .form-row, .content form .tiled-grid > .form-section.tile > .form-list, .tiled-grid > .tile > p, .tiled-grid > .tile > sp, .tiled-grid > .tile > i.icon, .tiled-grid > .tile > img {
  margin-left: 20px;
  margin-right: 20px;
}
.tiled-grid > .tile > h2 {
  color: #fff;
}
.tiled-grid > .tile > i.icon {
  font-size: 40pt;
}
.tiled-grid > .tile > img {
  width: 100%;
  max-width: 84%;
}
.tiled-grid > .tile > .on-bottom {
  margin: 0;
  padding: 0;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
}
.tiled-grid > .tile .content-grid li {
  text-align: left;
}
.tiled-grid > .tile .content-grid li h1, .tiled-grid > .tile .content-grid li h2 {
  text-align: left;
  font-size: 30.8pt;
}

/*
*	Preview styles
*	Adjusted styles for presenting preview of data
*	Fitted to display data rather than to interact with it
*/
div.preview-body .preview-section {
  margin-bottom: 12pt;
}
div.preview-body .preview-section .CheckField i {
  font-size: 16pt;
}
div.preview-body .preview-section .CheckField i.true {
  color: green;
}
div.preview-body .preview-section .OptionField {
  padding: 2px;
}
div.preview-body .preview-section .OptionField b {
  font-weight: bold;
  height: auto;
  font-size: 0.9rem;
  line-height: 100%;
}
div.preview-body .preview-section .OptionField.lights b, div.preview-body .preview-section .OptionField.lights.rounded b, div.preview-body .preview-section .OptionField.lights.toggle b {
  display: inline-block;
  border-radius: 16pt;
  border: 1px solid #ccc;
  width: 16pt;
  height: 16pt;
  min-width: 0;
}
div.preview-body .preview-section .OptionField.lights b.true, div.preview-body .preview-section .OptionField.lights.rounded b.true, div.preview-body .preview-section .OptionField.lights.toggle b.true {
  color: green;
}
div.preview-body .preview-section .preview-section-title {
  font-size: 10pt;
  font-weight: bold;
  margin-bottom: 4pt;
  background-color: #c6ffc9;
  border-bottom: 0px solid #f6e9d8;
  margin-left: -6px;
  margin-right: -20px;
  padding-left: 18px;
  padding-top: 10px;
  padding-bottom: 4px;
  margin-bottom: 4pt;
}
div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-label {
  max-width: 12rem;
  width: 20%;
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
}
div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-data {
  border-bottom: 2px solid #fff;
}
div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-data p.value {
  display: inline-block;
  border: none;
  height: auto;
  width: auto;
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.9);
  font-weight: bold;
  background-color: #C3FFC3;
  padding: 4px 10px;
}
div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-data.CheckField p.value, div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-data.OptionField p.value {
  background-color: transparent;
  padding-left: 0;
}
div.preview-body .preview-section .preview-plain-section-content td.preview-plain-section-data.PhotoField p.value .frame {
  width: 100%;
}
div.preview-body .preview-section .preview-table-section-content td {
  border-right: 4px solid #fff;
}
div.preview-body .preview-section .preview-table-section-content td.preview-table-section-label {
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
  padding: 2px;
  font-weight: bold;
  text-align: center;
  border-bottom: 1px solid #111;
}
div.preview-body .preview-section .preview-table-section-content td.preview-table-section-data {
  border-bottom: 2px solid #fff;
  vertical-align: middle;
  border-bottom: 1px solid #C3FFC3;
  text-align: center;
}
div.preview-body .preview-section .preview-table-section-content td.preview-table-section-data p.value {
  display: inline-block;
  border: none;
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
  padding: 4px;
  height: auto;
}
div.preview-body .preview-section .preview-table-section-content td.preview-table-section-data.ItemField, div.preview-body .preview-section .preview-table-section-content td.preview-table-section-data.TextField {
  text-align: left;
}
div.preview-body .preview-section .preview-table-section-content td.preview-table-section-data.PhotoField p.value .frame {
  width: 100%;
}
div.preview-body .preview-footer .preview-footer-note {
  color: rgba(0, 0, 0, 0.8);
  padding: 20px 0;
}

/*
*	Form elements
*/
/*
*	Standard form elements
*	Fields in a standard web form inside a Page
*/
/*
Form container elements

	form
		form-section
			form-list
				li
					label
						input | ...
						action-btn
						p.hint
							help
			form-row
			form-paragraph
			form-table




*/
.content form {
  margin: 0;
  padding: 0;
}
.content form .form-section {
  margin-bottom: 20pt;
  position: relative;
}
.content form .form-section h2 {
  font-size: 11pt;
  font-weight: bold;
  background-color: #c6ffc9;
  border-bottom: 0px solid #f6e9d8;
  display: block;
  margin-left: -6px;
  margin-right: -20px;
  padding-left: 18px;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 10pt;
}
.content form .form-section h2 > b {
  font-size: 16pt;
  background-color: transparent;
  color: #fff;
  font-weight: bold;
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: top;
}
.content form .form-section > .form-paragraph {
  font-size: 1rem;
}
.content form .form-section > .form-paragraph b {
  display: inline-block;
  padding-top: 2px;
}
.content form .form-section > .form-list {
  margin-bottom: 20px;
}
.content form .form-section > .form-list li {
  margin: 0;
  padding: 0;
  margin-bottom: 10px;
}
.content form .form-section > .form-row {
  margin-bottom: 20px;
}
.content form .form-section > .form-row li {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: 1px dotted #ddd;
  margin-bottom: 10px;
}
.content form .form-section > .form-row li > label {
  display: none;
}
.content form .form-section > .form-row li > p.hint {
  display: none;
}
.content form .form-section > .form-table {
  margin: 0;
  padding: 0;
  margin-bottom: 20px;
  border: 0px dotted #aac;
}
.content form .form-section > .form-table table {
  /*
  *	Estas columnas tienen VISIBILIDAD CONDICIONAL
  *	quiere decir que pueden estar ocultas a veces
  *	y otras veces estar visibles, dependiendo de
  *	los valores en otros campos.
  */
  /*
  *	Estas columnas estaran SIEMPRE OCULTAS
  *	quiere decir que no estaran NUNCA VISIBLES
  *	y no dependen del valor de otros campos
  */
}
.content form .form-section > .form-table table tr.template {
  display: none;
}
.content form .form-section > .form-table table td.buttons, .content form .form-section > .form-table table th.buttons {
  border: none;
  background-color: #fff;
  width: 26pt;
}
.content form .form-section > .form-table table th {
  font-size: 0.9rem;
  text-align: center;
  vertical-align: bottom;
  padding: 6pt 4pt 2pt 4pt;
  overflow-x: hidden;
  border-bottom: 1px solid #666;
  border-right: 4px solid #fff;
}
.content form .form-section > .form-table table td {
  border-bottom: 2px solid #ffA500;
  border-right: 4px solid #fff;
  padding: 0;
  text-align: center;
  vertical-align: bottom;
}
.content form .form-section > .form-table table td.error {
  border-bottom: 2px dotted red;
}
.content form .form-section > .form-table table td[readonly=true], .content form .form-section > .form-table table td[readonly=readonly] {
  border-bottom: 1px solid #ccc;
  width: auto !important;
}
.content form .form-section > .form-table table td p.value, .content form .form-section > .form-table table td input.value, .content form .form-section > .form-table table td textarea.value {
  width: 100%;
  padding-left: 0;
  padding-right: 0;
  font-size: 1.1rem;
  border: none;
  min-height: 1.1rem;
  height: auto;
}
.content form .form-section > .form-table table td p.buttons {
  float: none;
  margin-top: 10px;
}
.content form .form-section > .form-table table th.ItemField p.value, .content form .form-section > .form-table table th.TextField p.value, .content form .form-section > .form-table table td.ItemField p.value, .content form .form-section > .form-table table td.TextField p.value {
  text-align: left;
}
.content form .form-section > .form-table table td.PhotoField {
  border-bottom: 0px solid #ffA500;
}
.content form .form-section > .form-table table td.PhotoField p.value {
  min-height: 0;
  padding-bottom: 0px;
  padding-top: 2px;
}
.content form .form-section > .form-table table td.PhotoField p.value span.frame {
  width: 45%;
}
.content form .form-section > .form-table table td.PhotoField a.field-action-btn {
  border: 2px solid #ffA500;
}
.content form .form-section > .form-table table td.OptionField {
  padding-top: 10px;
}
.content form .form-section > .form-table table td.OptionField.lights {
  width: 46px;
}
.content form .form-section > .form-table table td.OptionField p.value {
  padding-bottom: 2pt;
}
.content form .form-section > .form-table table td.CheckField p.value {
  font-size: 26.4pt;
  padding-bottom: 0pt;
}
.content form .form-section > .form-table table td.CalculatedField {
  border-bottom: 1px solid #ccc;
  min-width: 4em;
}
.content form .form-section > .form-table table th.hidden[col-hidden=false] {
  display: table-cell !important;
}
.content form .form-section > .form-table table td.hidden[col-hidden=false] {
  display: table-cell !important;
  border: none;
}
.content form .form-section > .form-table table td.hidden[col-hidden=false] p.value {
  display: none !important;
}
.content form .form-section > .form-table table th[col-hidden=true], .content form .form-section > .form-table table td[col-hidden=true],
.content form .form-section > .form-table table th.hidden[col-hidden=true], .content form .form-section > .form-table table td.hidden[col-hidden=true] {
  display: none !important;
}

label {
  display: block;
  float: none;
  font-weight: bold;
  text-align: left;
  word-wrap: none;
  white-space: nowrap;
  overflow: hidden;
  width: 36rem;
  padding-bottom: 0;
  margin: 0;
  padding-left: 0;
  margin-top: 10px;
  font-family: "Nunito Regular";
  font-size: 0.9rem;
  border: none;
  width: 98%;
}
label em {
  margin-right: 2em;
}
label > b.required {
  font-size: 2em;
  color: orange;
  display: inline-block;
  margin-top: -0.2em;
}
.gt-480 .form-list label {
  display: inline-block;
  border-bottom: 1px solid #ddd;
  float: left;
  vertical-align: top;
  margin-top: 0pt;
  padding-top: 10pt;
  padding-bottom: 1px;
  width: 12rem;
  height: 16.5pt;
}

p.hint {
  display: block;
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
  max-width: 98%;
  padding: 2pt 0 4pt 4px;
  margin-left: 0;
}
p.hint.error {
  color: red;
}
.gt-480 .form-list p.hint {
  margin-left: 13rem;
}

p.status-bar {
  display: block;
  font-size: 1.1rem;
  color: rgba(0, 0, 0, 0.9);
  max-width: 98%;
  padding: 10px 10px;
  margin-left: 0;
}
p.status-bar.error {
  border-left: 4px solid red;
  color: red;
  padding-left: 20px;
}
p.status-bar.warning {
  border-left: 4px solid yellow;
  padding-left: 20px;
}

.FormField, .GraphField, .AttachsField, .PhotoField, .EmailAlertPlugin, .PdfFusionPlugin, .RemoteCallPlugin, .LocalTicketPlugin, .QRcodeField, .CheckField, .OptionField, .ItemField, .DateField,
.NumberField,
.TimeField,
.CalculatedField, .TextField {
  padding: 0;
  margin: 0;
}
.FormField.error > label b.required, .error.GraphField > label b.required, .error.AttachsField > label b.required, .error.PhotoField > label b.required, .error.EmailAlertPlugin > label b.required, .error.PdfFusionPlugin > label b.required, .error.RemoteCallPlugin > label b.required, .error.LocalTicketPlugin > label b.required, .error.QRcodeField > label b.required, .error.CheckField > label b.required, .error.OptionField > label b.required, .error.ItemField > label b.required, .error.DateField > label b.required,
.error.NumberField > label b.required,
.error.TimeField > label b.required,
.error.CalculatedField > label b.required, .error.TextField > label b.required {
  color: red;
}
.FormField p.value, .GraphField p.value, .AttachsField p.value, .PhotoField p.value, .EmailAlertPlugin p.value, .PdfFusionPlugin p.value, .RemoteCallPlugin p.value, .LocalTicketPlugin p.value, .QRcodeField p.value, .CheckField p.value, .OptionField p.value, .ItemField p.value, .DateField p.value,
.NumberField p.value,
.TimeField p.value,
.CalculatedField p.value, .TextField p.value,
.FormField input.value,
.GraphField input.value,
.AttachsField input.value,
.PhotoField input.value,
.EmailAlertPlugin input.value,
.PdfFusionPlugin input.value,
.RemoteCallPlugin input.value,
.LocalTicketPlugin input.value,
.QRcodeField input.value,
.CheckField input.value,
.OptionField input.value,
.ItemField input.value,
.DateField input.value,
.NumberField input.value,
.TimeField input.value,
.CalculatedField input.value,
.TextField input.value,
.FormField textarea.value,
.GraphField textarea.value,
.AttachsField textarea.value,
.PhotoField textarea.value,
.EmailAlertPlugin textarea.value,
.PdfFusionPlugin textarea.value,
.RemoteCallPlugin textarea.value,
.LocalTicketPlugin textarea.value,
.QRcodeField textarea.value,
.CheckField textarea.value,
.OptionField textarea.value,
.ItemField textarea.value,
.DateField textarea.value,
.NumberField textarea.value,
.TimeField textarea.value,
.CalculatedField textarea.value,
.TextField textarea.value {
  display: block;
  font-family: Verdana, Helvetica, sans-serif;
  font-size: 1.4rem;
  padding: 4px;
  border: none;
  border-bottom: 1px solid #ffA500;
  min-height: 0.9rem;
  color: rgba(0, 0, 0, 0.8);
  margin: 0;
  width: 98%;
  word-wrap: none;
  overflow: hidden;
}
.FormField textarea.value, .GraphField textarea.value, .AttachsField textarea.value, .PhotoField textarea.value, .EmailAlertPlugin textarea.value, .PdfFusionPlugin textarea.value, .RemoteCallPlugin textarea.value, .LocalTicketPlugin textarea.value, .QRcodeField textarea.value, .CheckField textarea.value, .OptionField textarea.value, .ItemField textarea.value, .DateField textarea.value,
.NumberField textarea.value,
.TimeField textarea.value,
.CalculatedField textarea.value, .TextField textarea.value {
  display: block;
  height: 6em;
  width: 98%;
  background-image: url("../img/renglon.png");
  background-repeat: repeat;
  background-position: left top;
  line-height: 26px;
  font-size: 16px;
  border: 1px solid #ffA500;
  border-bottom: none;
}
.FormField select, .GraphField select, .AttachsField select, .PhotoField select, .EmailAlertPlugin select, .PdfFusionPlugin select, .RemoteCallPlugin select, .LocalTicketPlugin select, .QRcodeField select, .CheckField select, .OptionField select, .ItemField select, .DateField select,
.NumberField select,
.TimeField select,
.CalculatedField select, .TextField select {
  padding: 5px;
  font-size: 1.1rem;
}
.FormField p.buttons, .GraphField p.buttons, .AttachsField p.buttons, .PhotoField p.buttons, .EmailAlertPlugin p.buttons, .PdfFusionPlugin p.buttons, .RemoteCallPlugin p.buttons, .LocalTicketPlugin p.buttons, .QRcodeField p.buttons, .CheckField p.buttons, .OptionField p.buttons, .ItemField p.buttons, .DateField p.buttons,
.NumberField p.buttons,
.TimeField p.buttons,
.CalculatedField p.buttons, .TextField p.buttons, .FormField.short p.buttons {
  display: inline-block;
  float: right;
  margin-right: 10px;
  margin-top: -26px;
}
.FormField.long p.buttons, .long.GraphField p.buttons, .long.AttachsField p.buttons, .long.PhotoField p.buttons, .long.EmailAlertPlugin p.buttons, .long.PdfFusionPlugin p.buttons, .long.RemoteCallPlugin p.buttons, .long.LocalTicketPlugin p.buttons, .long.QRcodeField p.buttons, .long.CheckField p.buttons, .long.OptionField p.buttons, .long.ItemField p.buttons, .long.DateField p.buttons,
.long.NumberField p.buttons,
.long.TimeField p.buttons,
.long.CalculatedField p.buttons, .long.TextField p.buttons {
  margin-top: -30px;
}
.FormField[readonly=true] .value, [readonly=true].GraphField .value, [readonly=true].AttachsField .value, [readonly=true].PhotoField .value, [readonly=true].EmailAlertPlugin .value, [readonly=true].PdfFusionPlugin .value, [readonly=true].RemoteCallPlugin .value, [readonly=true].LocalTicketPlugin .value, [readonly=true].QRcodeField .value, [readonly=true].CheckField .value, [readonly=true].OptionField .value, [readonly=true].ItemField .value, [readonly=true].DateField .value,
[readonly=true].NumberField .value,
[readonly=true].TimeField .value,
[readonly=true].CalculatedField .value, [readonly=true].TextField .value, .FormField[readonly=readonly] .value, [readonly=readonly].GraphField .value, [readonly=readonly].AttachsField .value, [readonly=readonly].PhotoField .value, [readonly=readonly].EmailAlertPlugin .value, [readonly=readonly].PdfFusionPlugin .value, [readonly=readonly].RemoteCallPlugin .value, [readonly=readonly].LocalTicketPlugin .value, [readonly=readonly].QRcodeField .value, [readonly=readonly].CheckField .value, [readonly=readonly].OptionField .value, [readonly=readonly].ItemField .value, [readonly=readonly].DateField .value,
[readonly=readonly].NumberField .value,
[readonly=readonly].TimeField .value,
[readonly=readonly].CalculatedField .value, [readonly=readonly].TextField .value {
  border: 1px solid #ccc;
  width: auto !important;
  min-width: 2em;
}
.FormField i.error, .GraphField i.error, .AttachsField i.error, .PhotoField i.error, .EmailAlertPlugin i.error, .PdfFusionPlugin i.error, .RemoteCallPlugin i.error, .LocalTicketPlugin i.error, .QRcodeField i.error, .CheckField i.error, .OptionField i.error, .ItemField i.error, .DateField i.error,
.NumberField i.error,
.TimeField i.error,
.CalculatedField i.error, .TextField i.error {
  color: red;
}
.gt-480 .form-list .short input.value, .gt-480 .form-list p.value {
  display: inline-block;
  margin-left: 10px;
  width: 59%;
  max-width: 36rem;
  border: none;
  border-bottom: 2px solid #ffA500;
  overflow: hidden;
  height: 22pt;
}
.gt-480 .form-list .long p.value, .gt-480 .form-list .long input.value, .gt-480 .form-list .notes textarea.value {
  border: none;
  border-bottom: 2px solid #ffA500;
  width: 98%;
  max-width: 98%;
  margin-left: 0;
}
.gt-480 .form-list [readonly=true] .value, .gt-480 .form-list [readonly=readonly] .value {
  border-bottom: 1px solid #ccc;
  width: auto !important;
}
.gt-480 .form-list .long label, .gt-480 .form-list .notes label {
  border: none;
  padding-bottom: 0;
  width: 98%;
  height: auto;
}
.gt-480 .form-list .long p.hint, .gt-480 .form-list .notes p.hint {
  margin-left: 0;
  width: 98%;
}
.gt-480 .form-list p.value.error, .gt-480 .form-list .short input.value.error, .gt-480 .form-list .long p.value.error, .gt-480 .form-list .long input.value.error, .gt-480 .form-list .notes textarea.value.error {
  border-bottom: 2px dotted red;
}
.gt-480 .form-list p.buttons {
  margin-top: 0px;
}

.TextField[readonly=true] textarea.value, .TextField[readonly=readonly] textarea.value {
  border: none;
  background-image: url("../img/renglon-readonly.png");
  width: 98% !important;
}
.gt-480 .form-list .TextField[readonly=true] textarea.value, .gt-480 .form-list .TextField[readonly=readonly] textarea.value {
  border: none;
  background-image: url("../img/renglon-readonly.png");
  width: 98% !important;
}

.gt-480 .form-list .DateField p.value,
.gt-480 .form-list .NumberField p.value,
.gt-480 .form-list .TimeField p.value,
.gt-480 .form-list .CalculatedField p.value {
  width: 39.3333333333%;
  max-width: 24rem;
}

.gt-480 .form-list .CalculatedField p.value {
  border-bottom: 1px solid #ccc;
  width: auto !important;
  min-width: 4em;
}

.OptionField p.value, .OptionField.select p.value {
  border: 0px dotted red !important;
  padding: 0 0 4px 0;
  height: auto !important;
  width: auto !important;
}
.OptionField p.value b, .OptionField.select p.value b {
  display: inline-block;
  height: 22pt;
  line-height: 22pt;
  font-size: 1.1rem;
  border: 1px solid #ccc;
  margin: 0;
  margin-right: 1px;
  margin-top: 4px;
  padding: 6pt;
  padding-bottom: 2px;
  padding-top: 3px;
  font-weight: normal;
  background-color: #ddd;
  opacity: 0.8;
  min-width: 20pt;
  text-align: center;
}
.OptionField p.value b.selected, .OptionField.select p.value b.selected {
  opacity: 1;
  padding-bottom: 7px;
  padding-top: 7px;
  margin-top: 0;
  background-color: #666;
  color: #fff;
}
.OptionField.select > p.value > b {
  display: none;
  border: 1px solid #ffA500;
}
.OptionField.select > p.value > b.selected {
  display: inline-block;
}
.OptionField.select > p.value > b.notselected {
  background-color: #ccc;
  display: none;
}
.OptionField.select[data-value=""] > p.value > b.notselected {
  display: inline-block;
}
.OptionField.select select.value {
  background-color: #eee;
  height: 29pt;
}
.OptionField.lights p.value > b {
  display: inline-block;
  width: 32px;
  height: 32px;
  padding: 0;
  margin: 0;
  border-radius: 24px;
  border: 1px solid #aaa;
  margin-right: 2px;
}
.OptionField.lights p.value > b.selected {
  display: inline-block;
  opacity: 1;
  border: 2px solid #111;
  height: 40px;
  width: 40px;
}
.OptionField.lights p.value > b.notselected {
  background-color: #fff;
}
.OptionField.lights p.value > b[value=":ROJO"] {
  background-color: red;
  color: #fff;
  opacity: 0.7;
}
.OptionField.lights p.value > b[value=":AMARILLO"] {
  background-color: yellow;
  color: #111;
  opacity: 0.8;
}
.OptionField.lights p.value > b[value=":VERDE"] {
  background-color: lime;
  color: #fff;
  opacity: 0.7;
}
.OptionField.lights p.value > b[value=":?"] {
  background-color: #ccc;
  color: #fff;
  opacity: 0.7;
}
.OptionField.lights.toggle[data-value=""] > p.value > b.notselected {
  display: inline-block;
}
.OptionField.lights.toggle p.value > b {
  display: none;
}
.OptionField.lights.toggle p.value > b.selected {
  display: inline-block;
}
.OptionField.lights.toggle p.value > b.notselected {
  background-color: #fff;
}

.form-list .CheckField label {
  display: inline-block;
  float: left;
  max-width: 12rem;
  padding-top: 10pt;
  border: none;
}
.form-list .CheckField p.value {
  display: inline-block;
  border: 0px dotted red;
  width: 32px;
  margin-left: 10px;
}

.gt-480 .form-list .CheckField label {
  border: none;
}
.gt-480 .form-list .CheckField p.value {
  float: none;
  text-align: left;
}

.CheckField i.true {
  color: green;
}
.CheckField i.false.normal {
  color: #999;
}
.CheckField i.false.caution {
  color: #FFB800;
}
.CheckField i.false.alarm {
  color: red;
}

.RemoteCallPlugin p.buttons a.action-btn, .RemoteCallPlugin p.buttons a.row-action-btn, .RemoteCallPlugin p.buttons a.field-action-btn {
  position: absolute;
  right: 10px;
  background-color: #fff !important;
}
.RemoteCallPlugin p.value {
  height: auto;
  overflow: auto !important;
  font-size: 1.1rem;
}

.EmailAlertPlugin[data-value=true] b.true {
  display: inline-block;
  color: red;
  font-weight: normal;
}
.EmailAlertPlugin[data-value=true] b.false {
  display: none;
}
.EmailAlertPlugin[data-value=false] b.false {
  display: inline-block;
  color: #999;
  font-weight: normal;
}
.EmailAlertPlugin[data-value=false] b.true {
  display: none;
}

.PhotoField p.value {
  height: auto !important;
}
.PhotoField p.value span.frame {
  display: inline-block;
  vertical-align: bottom;
  border: 0px dotted red;
  margin: 0 2px 2px 0;
  width: 23%;
  max-width: 200pt;
  max-height: 200pt;
  padding: 2px;
  position: relative;
}
.PhotoField p.value span.frame.zoomed {
  display: block;
  width: 98%;
  max-width: 98%;
  max-height: 100%;
}
.PhotoField p.value span.frame img {
  display: inline-block;
  width: 100%;
  border: 1px solid #ccc;
  padding: 1px;
  margin: 0;
  position: relative;
}
.PhotoField p.value span.frame i {
  display: inline-block;
  color: red;
  background-color: transparent;
  width: 34px;
  height: 34px;
  padding: 0;
  text-align: center;
  vertical-align: middle;
  font-size: 28px;
  line-height: 28px;
  position: absolute;
  right: 4pt;
  bottom: 8pt;
}

.AttachsField p.value {
  min-height: 22pt;
  height: auto !important;
  line-height: 28px;
  border-bottom: none;
}
.AttachsField p.value a.attachment {
  display: block;
  background-color: #eee;
  font-size: 1.1rem;
  vertical-align: top;
  margin: 0 0 2px 0;
  padding: 2px 1em;
  cursor: pointer;
}
.AttachsField p.value a.attachment.failed > .name {
  text-decoration: line-through;
  font-style: italic;
}
.AttachsField p.value a.attachment .state {
  display: inline-block;
  float: right;
  margin-right: 1em;
}
.AttachsField p.value a.attachment i {
  display: inline-block;
  color: #999;
  background-color: transparent;
  font-size: 22px;
  float: right;
  vertical-align: middle;
}

.GraphField p.value {
  border: 1px solid #ddd;
  min-height: 4em !important;
  min-width: 12em !important;
  padding: 0;
}
.GraphField textarea[name=data] {
  display: none;
}

.ConditionalFields,
.ConditionalFieldsOnly,
.ConditionalSectionsOnly,
.ConditionalRowsOnly,
.ListColumnsCopy,
.ListColumnField,
.ListOperationField {
  display: none;
  width: 0;
  border: none;
}

/*
*	UI elements
*/
/*
*	Buttons
*/
a.action-btn, a.row-action-btn, a.field-action-btn {
  font-family: UI, RobotoDraft, Helvetica, Arial, sans-serif;
  display: inline-block;
  font-size: 0px;
  font-weight: normal;
  line-height: 38px;
  width: 36px;
  height: 36px;
  padding: 0;
  margin: 0;
  text-align: center;
  vertical-align: middle;
  border-radius: 23px;
  border: 2px solid #999;
  background-color: #666;
  cursor: default;
}
a.action-btn i, a.row-action-btn i, a.field-action-btn i {
  font-size: 26px;
  color: #fff;
  vertical-align: middle;
  text-align: center;
  display: inline-block;
}
a.action-btn i.small, a.row-action-btn i.small, a.field-action-btn i.small {
  font-size: 20px;
}
.action-bar.elevated a.action-btn.more, .action-bar.elevated a.more.row-action-btn, .action-bar.elevated a.more.field-action-btn {
  height: 47px;
  width: 60px;
  border: none;
  background-color: #111;
  border-radius: 0px;
  margin-right: 0px;
}

a.action-btn.touched, a.touched.row-action-btn, a.touched.field-action-btn {
  padding: 0;
  border-radius: 23px !important;
}

span.action-input {
  border: 0px solid #ccc;
  display: inline-block;
  padding: 6pt;
  padding-left: 16pt;
  margin-top: -5px;
  border-radius: 37pt;
  background-color: #666;
}
span.action-input input {
  border: none;
  background: transparent;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
  font-size: 16pt;
  color: white;
  font-weight: normal;
}
span.action-input input:focus {
  outline: 0;
}
span.action-input a.action-btn, span.action-input a.row-action-btn, span.action-input a.field-action-btn {
  border: none;
}

.row-action-btn, .field-action-btn {
  width: 32px;
  height: 32px;
  border-radius: 4px;
  background-color: transparent !important;
}
.row-action-btn > i, .field-action-btn > i {
  color: rgba(0, 0, 0, 0.9) !important;
  font-size: 22px;
}

button {
  font-family: "Nunito Light", "UI", "Helvetica", sans-serif;
  font-size: 1.1rem;
  font-weight: normal;
  padding: 8px 20px;
  color: rgba(0, 0, 0, 0.9);
  cursor: default;
}
button > i {
  font-size: 32px;
  color: rgba(0, 0, 0, 0.9);
}
button.confirm-btn {
  border-radius: 10px;
  border: 2px solid #999;
  background-color: #666;
  color: #fff;
  font-family: Verdana, Helvetica, sans-serif;
  font-size: 1.1rem;
  padding: 10px 20px;
}
button.clear {
  background-color: transparent;
  border: 0px;
  padding-left: 0 !important;
  text-align: left;
}
button.big {
  font-size: 1.2rem;
  font-weight: bold;
  padding: 10px 20px;
  min-width: 15em;
}
.footer.elevated button {
  border: none;
  background-color: transparent;
  color: #111;
  min-width: 40pt;
}
.footer.elevated button > i {
  font-size: 32px;
  color: #fff;
  border-radius: 30px;
  border: 2px solid #999;
  width: 46px;
  height: 46px;
  display: inline-block;
  padding: 4px 4px 4px 4px;
  margin-bottom: 4px;
  background-color: #111;
}

/*
*	Tabs and Tab sets
*/
.tab {
  margin-right: 20px;
  font-size: 12pt;
  display: inline-block;
  font-weight: normal;
}
.tab.selected {
  font-size: 110%;
  font-weight: bold;
  color: white;
  position: relative;
}
.tab.selected:after {
  position: absolute;
  font-family: "Ionicons";
  top: 22px;
  left: 0rem;
  content: "\f10d";
  color: white;
  font-size: 41px;
}

/*
*	Help and tips
*/
.aside {
  display: inline;
  font-family: "Nunito SemiBold";
  font-size: inherit;
  color: #0084fd !important;
  border-bottom: 1px dotted rgba(0, 132, 253, 0.8);
}

/*
*	Popups and other flyouts
*/
.popup {
  display: none;
}

/*
*	Numeric Keyboard
*	Goes on bottom of screen
*/
.NumericKeyboard, .ActionbarPad, .OptionsPad, .CalendarPad {
  position: fixed;
  top: 1000;
  right: 0;
  z-index: 4;
  text-align: center;
  padding: 0;
  margin: 0;
  display: none;
}
.NumericKeyboard.popup, .popup.ActionbarPad, .popup.OptionsPad, .popup.CalendarPad {
  display: block;
}
.NumericKeyboard input, .ActionbarPad input, .OptionsPad input, .CalendarPad input {
  font-size: 1.4rem;
  width: 238px;
  padding: 4px;
  border: 1px solid orange;
}
.NumericKeyboard div.pointer-top, .ActionbarPad div.pointer-top, .OptionsPad div.pointer-top, .CalendarPad div.pointer-top {
  display: block;
  margin: 0;
  padding: 0;
  text-align: left;
  margin-top: -18px;
}
.NumericKeyboard div.pointer-top i, .ActionbarPad div.pointer-top i, .OptionsPad div.pointer-top i, .CalendarPad div.pointer-top i {
  display: inline-block;
  margin: 0;
  padding: 0;
  margin-left: 25%;
  margin-bottom: -2px;
  font-size: 40px;
  vertical-align: bottom;
  height: 28px;
  color: #000;
}
.NumericKeyboard table, .ActionbarPad table, .OptionsPad table, .CalendarPad table {
  width: 320px;
  max-width: 320px;
  margin: 0;
  background-color: #000;
  table-layout: fixed;
}
.NumericKeyboard table tr, .ActionbarPad table tr, .OptionsPad table tr, .CalendarPad table tr {
  margin: 0;
  padding: 0;
}
.NumericKeyboard table tr td, .ActionbarPad table tr td, .OptionsPad table tr td, .CalendarPad table tr td {
  width: 69px;
  height: 69px;
  font-size: 22pt;
  font-weight: normal;
  border: 8px solid #000;
  color: #fff;
}
.NumericKeyboard table tr td.num-btn, .ActionbarPad table tr td.num-btn, .OptionsPad table tr td.num-btn, .CalendarPad table tr td.num-btn {
  background-color: #4a4a4a;
}
.NumericKeyboard table tr td.op-btn, .ActionbarPad table tr td.op-btn, .OptionsPad table tr td.op-btn, .CalendarPad table tr td.op-btn {
  background-color: #5a5a5a;
}

/*
*	Goes on bottom of screen
*/
.CalendarPad table._Calendar {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  margin: 0 auto;
}
.CalendarPad table._Calendar td {
  width: 36px;
  height: 46px;
  text-align: center;
  padding: 0px;
  border: 1px solid #000;
  font-size: 1.1rem;
}
.CalendarPad table._Calendar td input {
  width: 100%;
  height: 100%;
  color: #fff;
  border: none;
  background-color: transparent;
  border-radius: 0;
  display: inline-block;
  text-align: center;
}
.CalendarPad table._Calendar td.num-btn input {
  font-size: 12pt;
}
.CalendarPad table._Calendar td.num-btn input.today {
  border: 1px solid #ccc;
  width: 90%;
}
.CalendarPad table._Calendar td.op-btn button {
  width: 100%;
  height: 100%;
  background: transparent;
  border: none;
}
.CalendarPad table._Calendar td.op-btn button i {
  font-size: 12pt;
  color: #fff;
}
.CalendarPad table._Calendar.visit td.num-btn input {
  font-size: 12pt;
}
.CalendarPad table._Calendar.visit .visits {
  display: block;
  font-size: 0.8em;
}
.CalendarPad table._Calendar.visit .visits .used {
  font-weight: bold;
}
/*
*	Goes on bottom of screen
*/
.OptionsPad {
  background-color: transparent;
  text-align: left;
}
.OptionsPad .options-list {
  display: block;
  width: auto !important;
  min-width: 0;
  margin: 0;
  background-color: #000;
  padding: 0.5rem 0.5rem;
}
.OptionsPad .options-list p.select {
  margin: 0;
  padding: 0;
}
.OptionsPad .options-list p.select > b {
  display: inline-block;
  background-color: #999;
  color: #fff;
  padding: 0.5rem;
  height: 22pt;
  line-height: 22pt;
  font-size: 16pt;
  border: 2px solid #000;
  font-weight: normal;
  opacity: 1;
  min-width: 4rem;
  text-align: center;
}
.OptionsPad .options-list p.select > b.notselected {
  display: none;
}
.OptionsPad .options-list p.lights {
  padding: 0;
  margin: 0;
}
.OptionsPad .options-list p.lights > b {
  display: inline-block;
  width: 32px;
  height: 32px;
  padding: 0;
  margin: 0.5rem 1rem;
  border-radius: 26px;
  border: 0px solid #bbb;
  font-size: 0rem;
  min-width: 0;
}
.OptionsPad .options-list p.lights > b.selected {
  opacity: 1;
  padding-bottom: 4px;
  padding-top: 4px;
  border: 1px solid #111;
  width: 40px;
}
.OptionsPad .options-list p.lights > b[value=":ROJO"] {
  background-color: red;
  color: #fff;
  opacity: 1;
  border: 4px solid #C30000;
}
.OptionsPad .options-list p.lights > b[value=":AMARILLO"] {
  background-color: yellow;
  color: #111;
  opacity: 1;
  border: 4px solid #ACAC00;
}
.OptionsPad .options-list p.lights > b[value=":VERDE"] {
  background-color: lime;
  color: #fff;
  opacity: 1;
  border: 4px solid #009400;
}
.OptionsPad .options-list p.lights > b[value=":?"] {
  background-color: #ddd;
  color: #888;
  opacity: 1;
  border: 4px solid #888;
}

/*
*	Goes on bottom of screen
*/
.ListPad {
  display: none;
  z-index: 2;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  padding: 0;
  margin: 0;
  overflow: auto;
  background-color: #fff;
}
.ListPad.popup {
  display: block;
}
.ListPad .action-bar {
  margin: 0;
  padding-left: 20px;
  padding-right: 10px;
  padding-top: 20px;
  padding-bottom: 10px;
  position: relative;
}
.ListPad .action-bar .actions-set {
  position: fixed;
  height: 42px;
  font-size: 24px;
  padding: 10px;
  padding-left: 20px;
  padding-right: 20px;
  top: 0px;
  left: 0;
  right: 0;
  background-color: #000;
  text-align: right;
  z-index: 3;
  color: #aaa;
}
.ListPad .action-bar .actions-set > .back {
  float: left;
}
.ListPad .action-bar .actions-set > .action-hint {
  float: left;
  margin-left: 32px;
  margin-top: 6px;
  color: #eee;
}
.ListPad .action-bar .actions-set > h3 {
  padding-left: 56px;
  line-height: 160%;
}
.ListPad .action-bar .actions-set > no-input {
  position: absolute;
  top: 15px;
  right: 20px;
  /*
  margin-top: -$hard-vertical-pad;
  margin-right: $soft-horizontal-pad ;
  */
  font-size: 16pt;
  line-height: 16pt;
  padding: 2px;
  color: rgba(0, 0, 0, 0.8);
}
.ListPad .content {
  margin-top: 62px;
  padding-left: 20px;
  padding-right: 10px;
}
.ListPad .content .selected {
  background-color: #ccc;
}
.ListPad .content li > a {
  color: orange;
}

.ActionbarPad {
  box-shadow: 3px 12px 26px #aaa;
}
.ActionbarPad div.pointer-top i {
  color: #999;
}
.ActionbarPad form {
  background-color: #ddd;
  text-align: left;
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-left: 1px solid #999;
  border-right: 1px solid #999;
  border-bottom: 2px solid #999;
  border-top: 16px solid #999;
  min-width: 30rem;
}
.ActionbarPad form div {
  overflow-y: auto;
  max-height: 40rem;
  margin: 0;
  padding: 0;
}
.ActionbarPad form h4 {
  margin-left: 0;
  margin-bottom: 5px;
  margin-top: 10px;
}
.ActionbarPad form hr {
  clear: both;
}
.ActionbarPad form p {
  padding-right: 1rem;
}
.ActionbarPad form fieldset legend {
  font-size: 12pt;
}
.ActionbarPad form label {
  display: inline-block;
  margin-top: 0.8rem;
  margin-left: 20px;
  width: 8rem;
  float: left;
  color: #222;
}
.ActionbarPad form input {
  display: inline-block;
  margin-left: 0rem;
  width: 16rem;
}
.ActionbarPad form select {
  display: inline-block;
  padding: 0.5rem;
  margin-left: 0rem;
  max-width: 19rem;
}
.ActionbarPad form span.checkbox {
  display: inline-block;
  padding: 0.2rem 1rem;
  margin-bottom: 0.4rem;
  margin-right: 0.4rem;
  line-height: 2.2rem;
  font-size: 0.9rem;
  font-weight: normal;
  color: #444;
  background-color: #f4f4f4;
  border-radius: 2px;
  border: 1px solid #fff;
  white-space: nowrap;
  overflow: hidden;
}
.ActionbarPad form span.checkbox.selected {
  background-color: #999;
  border: 1px solid #8a8a8a;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.11), 0 1px 2px rgba(0, 0, 0, 0.22);
  color: #fff;
}
.ActionbarPad form span.checkbox > input[type=checkbox] {
  display: inline;
  padding: 0;
  width: 1rem;
  vertical-align: middle;
}
.ActionbarPad form span.checkbox:hover {
  background-color: #999;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.11), 0 1px 2px rgba(0, 0, 0, 0.22);
  border: 1px solid #888;
  color: #fff;
}
.ActionbarPad form button {
  padding: 0rem 0.6rem;
  border: 1px solid #999;
}

/*
* All parameterized palette elements
*/
html {
  font-size: 12pt;
}

/*
*	TREMe colors
*/
/*
*	Layout elements
*/
/*
*	Content elements
*/
/*
*	UI elements
*/
/*
*	Form elements
*/
/***

A dialog container for modal Dialogs and Popups
-----------------------------------------------

*/
.dialog-container {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: transparent;
  z-index: 10;
  overflow: auto;
  display: none;
}
.dialog-container.visible {
  display: block;
}
.dialog-container > .dialog-overlay {
  position: fixed;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 11;
  background-color: #5a5a5a;
  opacity: 0.4;
}
.dialog-container > .dialog-overlay.transparent {
  background-color: transparent;
  opacity: 0;
}
.dialog-container > .dialog-content {
  position: relative;
  margin: auto;
  background-color: #fff;
  opacity: 1;
  z-index: 12;
  overflow-y: auto;
  box-shadow: none;
  border: 1px solid #222;
}
.dialog-container > .dialog-content.shadow {
  border: none;
  box-shadow: 0px 0px 20px #00005A;
}
.dialog-container > .dialog-content.no-border {
  border: none;
}
.dialog-container .dialog-pointer {
  position: absolute;
  background-color: transparent;
  height: 12px;
  z-index: 14;
}
.dialog-container .dialog-pointer img {
  width: 14px;
  margin: 0;
  padding: 0;
}

/*
*	A Toast which closes after some time
*/
.dialog-toast,
.dialog-attention {
  background-color: #fcffcc;
  opacity: 1;
  color: #222;
  padding: 20px 2em 10px 2em;
  font-family: sans-serif;
  font-size: 14px;
}
.dialog-toast .title, .dialog-toast .message,
.dialog-attention .title,
.dialog-attention .message {
  display: block;
  white-space: normal;
  color: inherit;
  font-family: inherit;
  padding: 0 0 10px 0;
  margin: 0;
  line-height: 22px;
  text-align: center;
}
.dialog-toast .title,
.dialog-attention .title {
  font-size: 1.2em;
}
.dialog-toast .message,
.dialog-attention .message {
  font-size: 1em;
}

.dialog-attention {
  background-color: #fff;
}

body {
  background-color: whitesmoke;
}

.page .action-bar {
  padding-top: 8px;
  padding-bottom: 4px;
  box-shadow: 4px 0px 20px #00005A;
}
.page .action-bar.light-bg {
  box-shadow: none !important;
  background-color: transparent;
}
.page .action-bar.light-bg .action-btn, .page .action-bar.light-bg .row-action-btn, .page .action-bar.light-bg .field-action-btn {
  background-color: #c4c4cf !important;
}
.page .action-bar.light-bg .action-btn:hover, .page .action-bar.light-bg .row-action-btn:hover, .page .action-bar.light-bg .field-action-btn:hover {
  background-color: #666 !important;
}
.page .action-bar.light-bg .action-btn.sos, .page .action-bar.light-bg .sos.row-action-btn, .page .action-bar.light-bg .sos.field-action-btn {
  background-color: #52c052 !important;
}
.page .action-bar.light-bg .title {
  color: #2f2f4f !important;
  font-weight: 100 !important;
  font-size: 24px !important;
  font-family: "Nunito Light";
}
.page .action-bar.light-bg .tab {
  padding: 0;
  font-size: 10pt !important;
  display: inline-block;
}
.page .action-bar.light-bg .tab.selected {
  font-size: 12pt !important;
  color: red !important;
  border-bottom: 4px solid red !important;
}
.page .action-bar.dark-bg {
  box-shadow: none;
}
.page .action-bar.dark-bg .title {
  color: #fff !important;
}
.page .action-bar.with-tabs {
  padding-bottom: 10px;
}
.page .action-bar.with-tabs > .actions-set {
  top: 26px !important;
  padding-top: 0;
  padding-bottom: 0;
}
.page .action-bar.with-tabs > .title {
  margin-top: 6px !important;
  margin-bottom: 1px;
  text-align: center;
  padding-left: 0;
  margin-top: 12px !important;
  font-size: 22px !important;
  font-weight: 600;
}
.page .action-bar.with-tabs > .tabs {
  padding-bottom: 6px;
  margin-top: 10px !important;
  padding-left: 0;
  text-align: center;
}
.page .action-bar.with-tabs > .tabs > .tab {
  border-bottom: 1px dotted transparent;
}
.page .action-bar.with-tabs > .tabs > .tab.selected {
  color: #fff;
}
.page .action-bar.with-tabs > .tabs > .tab:hover {
  border-bottom: 1px dotted #ff5f40;
}
.page .action-bar.with-tabs > .tabs > .admins-home-breadcrumbs,
.page .action-bar.with-tabs > .tabs > .tabs-breadcrumbs {
  margin-top: 6px;
  display: block;
  text-align: center;
  padding-left: 0;
  font-size: 10pt !important;
  color: #a4a4af !important;
}
.page .action-bar.with-tabs > .tabs > .admins-home-breadcrumbs a.breadcrumb,
.page .action-bar.with-tabs > .tabs > .tabs-breadcrumbs a.breadcrumb {
  color: inherit !important;
  font-size: inherit;
  border-bottom-style: dotted;
  border-bottom-width: 1px;
  padding-bottom: 0;
}
.page .action-bar.with-tabs > .tabs > .admins-home-breadcrumbs a.breadcrumb:hover,
.page .action-bar.with-tabs > .tabs > .tabs-breadcrumbs a.breadcrumb:hover {
  color: #ff5f40;
}
.page .action-bar.with-tabs > .tabs > .admins-home-breadcrumbs b,
.page .action-bar.with-tabs > .tabs > .tabs-breadcrumbs b {
  color: #a4a4af !important;
}
.page .action-bar.with-tabs > .tabs > .tab.selected {
  font-weight: bold;
  color: #efefef;
}
.page .action-bar.final.with-tabs .actions-set {
  position: fixed;
  top: 0px !important;
  background-color: #efefea;
  opacity: 0.6;
  padding-left: 20px;
  /* padding-bottom: 54px; */
  padding-top: 20px !important;
  height: 61px;
  box-shadow: 2px 2px 16px #ccc;
}
.page .action-bar.final.with-tabs .actions-set .action-btn, .page .action-bar.final.with-tabs .actions-set .row-action-btn, .page .action-bar.final.with-tabs .actions-set .field-action-btn {
  background-color: transparent !important;
  border: 2px solid transparent !important;
}
.page .action-bar.final.with-tabs .actions-set .action-btn i, .page .action-bar.final.with-tabs .actions-set .row-action-btn i, .page .action-bar.final.with-tabs .actions-set .field-action-btn i {
  color: #444 !important;
}
.page .action-bar.final.with-tabs .actions-set .action-btn:hover i, .page .action-bar.final.with-tabs .actions-set .row-action-btn:hover i, .page .action-bar.final.with-tabs .actions-set .field-action-btn:hover i {
  color: #ff5f40 !important;
}
.page .action-bar.final.with-tabs .actions-set .action-btn.sos, .page .action-bar.final.with-tabs .actions-set .sos.row-action-btn, .page .action-bar.final.with-tabs .actions-set .sos.field-action-btn {
  display: none;
}
.page .action-bar > .title.no-margin {
  margin-top: 2px !important;
  padding-left: 20px !important;
  padding-bottom: 2px;
  font-size: 18pt;
  line-height: 28pt;
  height: 26pt;
  padding-left: 0;
  text-align: center;
  color: #fff;
  font-size: 22pt;
}
.page .action-bar > .actions-set {
  top: 0px !important;
}
.page .action-bar > .tabs {
  padding-left: 56px;
}
.page .action-bar > .tabs .tab {
  color: #ff5f40;
}

.action-btn, .row-action-btn, .field-action-btn {
  background-color: transparent !important;
  cursor: pointer !important;
  border: 2px solid transparent !important;
}
.action-btn i, .row-action-btn i, .field-action-btn i {
  color: #fff !important;
  font-size: 22px !important;
}
.action-btn i.small, .row-action-btn i.small, .field-action-btn i.small {
  font-size: 18px !important;
}
.action-btn:hover, .row-action-btn:hover, .field-action-btn:hover {
  background-color: #666 !important;
  border: 2px solid #666 !important;
  color: #fff;
}
.action-btn:hover i, .row-action-btn:hover i, .field-action-btn:hover i {
  color: inherir !important;
}

.action-btn.sos, .sos.row-action-btn, .sos.field-action-btn {
  border-radius: 0;
  background-color: #52c052 !important;
  margin-right: -33px;
  color: #fff !important;
  font-size: 9px;
  height: 20px;
  line-height: 10px;
  transform: rotate(270deg);
  padding: 0;
  padding-top: 4px;
  color: #000;
  border: none !important;
  width: 46px;
  height: 15px;
}
.action-btn.sos:hover, .sos.row-action-btn:hover, .sos.field-action-btn:hover {
  border: none;
  width: 50px;
  height: 36px;
  font-weight: bold;
  font-size: 12px;
  transform: rotate(0deg);
  line-height: 36px;
  margin-right: -20px;
  padding-top: 0;
  color: #fff;
  box-shadow: 0px 0px 6px #aaa;
}

/*
patches for content.scss
*/
.content ul.content-grid, .content ul.content-grid.with-icons, .content form .form-section > .content-grid.form-list, .content form .form-section > .content-grid.form-row {
  padding-top: 1em !important;
  padding-left: 40px;
}

.content ul.content-grid > li, .content form .form-section > .content-grid.form-list > li, .content form .form-section > .content-grid.form-row > li,
.content ul.content-grid.with-icons > li {
  width: 180px !important;
  padding: 1em;
}
.content ul.content-grid > li h3, .content form .form-section > .content-grid.form-list > li h3, .content form .form-section > .content-grid.form-row > li h3,
.content ul.content-grid.with-icons > li h3 {
  font-size: 13pt;
}
.content ul.content-grid > li.add-btn i, .content form .form-section > .content-grid.form-list > li.add-btn i, .content form .form-section > .content-grid.form-row > li.add-btn i,
.content ul.content-grid.with-icons > li.add-btn i {
  color: #059c5e;
}
.content ul.content-grid > li:hover > i, .content form .form-section > .content-grid.form-list > li:hover > i, .content form .form-section > .content-grid.form-row > li:hover > i,
.content ul.content-grid.with-icons > li:hover > i {
  color: #ff5f40;
}

/* The ADD button in collections */
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn {
  border: 2px dashed #8a8;
  border-radius: 7px;
  width: 120px !important;
}
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn h3, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn h3, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn h3 {
  color: #8a8 !important;
  padding: 0 0.3em;
}
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn i, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn i, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn i {
  color: #8a8 !important;
  font-size: 46px;
}
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn:hover, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn:hover, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn:hover {
  border: 2px dashed #ff5f40;
}
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn:hover h3, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn:hover h3, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn:hover h3 {
  color: #ff5f40 !important;
}
.content ul.content-grid.with-icons > li.collection-grid-icon-cell.add-btn:hover i, .content form .form-section > .content-grid.with-icons.form-list > li.collection-grid-icon-cell.add-btn:hover i, .content form .form-section > .content-grid.with-icons.form-row > li.collection-grid-icon-cell.add-btn:hover i {
  color: #ff5f40 !important;
}

.collection-footer .collection-counter {
  padding: 0 40px;
  font-size: 12pt;
  text-align: center;
}

/* GLOBAL Patches for ALL Breadcrumbs */
.profile-full-name,
.account-full-name {
  color: #7e82a6;
}

.page .content .container #formulario.section {
  padding-top: 12px;
}
.page .content .container #proceso.section {
  padding-top: 0px;
  background-color: #eeeeef;
}
.page .content .container #lista.section {
  padding-top: 0px;
}

.no-page {
  height: 700px;
  width: 1024px;
  border: 1px dotted red;
}

/***

Dialog form and other minimum styling
-------------------------------------

*/
.dialog-content > form {
  width: inherit;
  min-width: inherit;
  max-width: inherit;
  font-family: "Nunito Regular";
  font-size: 14px;
  /*
  *	The fields container inside the form
  */
}
.dialog-content > form .dialog-btn {
  color: #ab3a3a;
  font-size: 22px;
  vertical-align: middle;
  font-weight: normal !important;
}
.dialog-content > form .dialog-btn:hover {
  font-size: 22px;
  margin-top: -4px;
  font-weight: bold !important;
}
.dialog-content > form .dialog-btn.close, .dialog-content > form .dialog-btn[icon=close] {
  float: right;
  margin-top: -30px;
  margin-right: -10px;
}
.dialog-content > form .dialog-buttons {
  color: #999;
  text-align: right;
  line-height: 22px;
  padding-right: 1em;
}
.dialog-content > form .dialog-content-header {
  padding: 0 !important;
}
.dialog-content > form .dialog-content-section {
  padding: 0 !important;
}
.dialog-content > form ul, .dialog-content > form .content ul.content-grid, .content .dialog-content > form ul.content-grid, .content .dialog-content > form .form-section > .form-list, .content .dialog-content > form .form-section > .form-row, .dialog-content > form div {
  padding: 3em 30px 1em 30px;
}
.dialog-content > form ul h2, .dialog-content > form .content ul.content-grid h2, .content .dialog-content > form ul.content-grid h2, .content .dialog-content > form .form-section > .form-list h2, .content .dialog-content > form .form-section > .form-row h2, .dialog-content > form div h2 {
  margin-top: -20px;
  margin-bottom: 20px;
}
.dialog-content > form ul h3, .dialog-content > form .content ul.content-grid h3, .content .dialog-content > form ul.content-grid h3, .content .dialog-content > form .form-section > .form-list h3, .content .dialog-content > form .form-section > .form-row h3, .dialog-content > form div h3 {
  font-size: 18px;
  margin-bottom: 20px;
  margin-top: 0px;
}
.dialog-content > form ul p, .dialog-content > form .content ul.content-grid p, .content .dialog-content > form ul.content-grid p, .content .dialog-content > form .form-section > .form-list p, .content .dialog-content > form .form-section > .form-row p, .dialog-content > form div p {
  padding: 0;
  margin: 0 0 20px 0;
  font-family: "Nunito Regular";
  font-size: 14px;
}
.dialog-content > form ul hr, .dialog-content > form .content ul.content-grid hr, .content .dialog-content > form ul.content-grid hr, .content .dialog-content > form .form-section > .form-list hr, .content .dialog-content > form .form-section > .form-row hr, .dialog-content > form div hr {
  margin-bottom: 20px;
}
.dialog-content > form ul li, .dialog-content > form .content ul.content-grid li, .content .dialog-content > form ul.content-grid li, .content .dialog-content > form .form-section > .form-list li, .content .dialog-content > form .form-section > .form-row li, .dialog-content > form div li {
  padding: 0;
  margin: 0 0 10px 0;
  display: flex;
  flex-direction: row;
  font-family: "Nunito Regular";
  font-size: 16px;
}
.dialog-content > form ul select, .dialog-content > form .content ul.content-grid select, .content .dialog-content > form ul.content-grid select, .content .dialog-content > form .form-section > .form-list select, .content .dialog-content > form .form-section > .form-row select,
.dialog-content > form ul input[type=text],
.content .dialog-content > form .form-section > .form-list input[type=text],
.content .dialog-content > form .form-section > .form-row input[type=text], .dialog-content > form ul input[type=number], .content .dialog-content > form .form-section > .form-list input[type=number], .content .dialog-content > form .form-section > .form-row input[type=number],
.dialog-content > form ul input[type=password],
.content .dialog-content > form .form-section > .form-list input[type=password],
.content .dialog-content > form .form-section > .form-row input[type=password],
.dialog-content > form ul textarea,
.dialog-content > form .content ul.content-grid textarea,
.content .dialog-content > form ul.content-grid textarea,
.content .dialog-content > form .form-section > .form-list textarea,
.content .dialog-content > form .form-section > .form-row textarea,
.dialog-content > form ul .options > .option,
.content .dialog-content > form .form-section > .form-list .options > .option,
.content .dialog-content > form .form-section > .form-row .options > .option, .dialog-content > form div select,
.dialog-content > form div input[type=text], .dialog-content > form div input[type=number],
.dialog-content > form div input[type=password],
.dialog-content > form div textarea,
.dialog-content > form div .options > .option {
  display: inline;
  padding: 4px 0.5em;
  border: 1px solid #ab3a3a;
  background: none;
  vertical-align: middle;
  line-height: 22px;
}
.dialog-content > form ul select[disabled=disabled], .content .dialog-content > form .form-section > .form-list select[disabled=disabled], .content .dialog-content > form .form-section > .form-row select[disabled=disabled],
.dialog-content > form ul input[type=text][disabled=disabled],
.content .dialog-content > form .form-section > .form-list input[type=text][disabled=disabled],
.content .dialog-content > form .form-section > .form-row input[type=text][disabled=disabled], .dialog-content > form ul input[type=number][disabled=disabled], .content .dialog-content > form .form-section > .form-list input[type=number][disabled=disabled], .content .dialog-content > form .form-section > .form-row input[type=number][disabled=disabled],
.dialog-content > form ul input[type=password][disabled=disabled],
.content .dialog-content > form .form-section > .form-list input[type=password][disabled=disabled],
.content .dialog-content > form .form-section > .form-row input[type=password][disabled=disabled],
.dialog-content > form ul textarea[disabled=disabled],
.content .dialog-content > form .form-section > .form-list textarea[disabled=disabled],
.content .dialog-content > form .form-section > .form-row textarea[disabled=disabled],
.dialog-content > form ul .options > .option[disabled=disabled],
.content .dialog-content > form .form-section > .form-list .options > .option[disabled=disabled],
.content .dialog-content > form .form-section > .form-row .options > .option[disabled=disabled], .dialog-content > form div select[disabled=disabled],
.dialog-content > form div input[type=text][disabled=disabled], .dialog-content > form div input[type=number][disabled=disabled],
.dialog-content > form div input[type=password][disabled=disabled],
.dialog-content > form div textarea[disabled=disabled],
.dialog-content > form div .options > .option[disabled=disabled] {
  border: 1px solid #ffb7a9;
}
.dialog-content > form ul .options-container .options, .content .dialog-content > form .form-section > .form-list .options-container .options, .content .dialog-content > form .form-section > .form-row .options-container .options, .dialog-content > form div .options-container .options {
  /* width: 200px; */
  display: inline;
  vertical-align: top;
  padding-right: 10px;
  line-height: 34px;
  margin-top: 0px;
}
.dialog-content > form ul .options-container .option, .content .dialog-content > form .form-section > .form-list .options-container .option, .content .dialog-content > form .form-section > .form-row .options-container .option, .dialog-content > form div .options-container .option {
  display: inline-block;
  margin-right: 2px;
  line-height: 20px;
}
.dialog-content > form ul .options-container .option i, .content .dialog-content > form .form-section > .form-list .options-container .option i, .content .dialog-content > form .form-section > .form-row .options-container .option i, .dialog-content > form div .options-container .option i {
  padding-left: 4px;
  border-left: 1px solid #ccc;
  margin-left: 6px;
  cursor: pointer;
}
.dialog-content > form ul .options-container select, .content .dialog-content > form .form-section > .form-list .options-container select, .content .dialog-content > form .form-section > .form-row .options-container select, .dialog-content > form div .options-container select {
  width: 46px;
  cursor: pointer;
}
.dialog-content > form ul .StringCtrl label, .dialog-content > form .content ul.content-grid .StringCtrl label, .content .dialog-content > form ul.content-grid .StringCtrl label, .dialog-content > form .content ul.content-grid.with-icons .StringCtrl label, .content .dialog-content > form ul.content-grid.with-icons .StringCtrl label, .dialog-content > form .content ul.with-icons.content-grid .StringCtrl label, .content .dialog-content > form ul.with-icons.content-grid .StringCtrl label, .content .dialog-content > form .form-section > .form-list .StringCtrl label, .content .dialog-content > form .form-section > .content-grid.form-list .StringCtrl label, .content .dialog-content > form .form-section > .content-grid.with-icons.form-list .StringCtrl label, .content .dialog-content > form .form-section > .with-icons.content-grid.form-list .StringCtrl label, .content .dialog-content > form .form-section > .form-row .StringCtrl label, .content .dialog-content > form .form-section > .content-grid.form-row .StringCtrl label, .content .dialog-content > form .form-section > .content-grid.with-icons.form-row .StringCtrl label, .content .dialog-content > form .form-section > .with-icons.content-grid.form-row .StringCtrl label,
.dialog-content > form ul .TextCtrl label,
.dialog-content > form .content ul.content-grid .TextCtrl label,
.content .dialog-content > form ul.content-grid .TextCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .TextCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .TextCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .TextCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .TextCtrl label,
.content .dialog-content > form .form-section > .form-list .TextCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .TextCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .TextCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .TextCtrl label,
.content .dialog-content > form .form-section > .form-row .TextCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .TextCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .TextCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .TextCtrl label,
.dialog-content > form ul .SelectCtrl label,
.dialog-content > form .content ul.content-grid .SelectCtrl label,
.content .dialog-content > form ul.content-grid .SelectCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .SelectCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .SelectCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .SelectCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .SelectCtrl label,
.content .dialog-content > form .form-section > .form-list .SelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .SelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .SelectCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .SelectCtrl label,
.content .dialog-content > form .form-section > .form-row .SelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .SelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .SelectCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .SelectCtrl label,
.dialog-content > form ul .MultiSelectCtrl label,
.dialog-content > form .content ul.content-grid .MultiSelectCtrl label,
.content .dialog-content > form ul.content-grid .MultiSelectCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .MultiSelectCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .MultiSelectCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .MultiSelectCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .form-list .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .form-row .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .MultiSelectCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .MultiSelectCtrl label,
.dialog-content > form ul .CombinedCtrl label,
.dialog-content > form .content ul.content-grid .CombinedCtrl label,
.content .dialog-content > form ul.content-grid .CombinedCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .CombinedCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .CombinedCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .CombinedCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .CombinedCtrl label,
.content .dialog-content > form .form-section > .form-list .CombinedCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .CombinedCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .CombinedCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .CombinedCtrl label,
.content .dialog-content > form .form-section > .form-row .CombinedCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .CombinedCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .CombinedCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .CombinedCtrl label,
.dialog-content > form ul .NumberCtrl label,
.dialog-content > form .content ul.content-grid .NumberCtrl label,
.content .dialog-content > form ul.content-grid .NumberCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .NumberCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .NumberCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .NumberCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .NumberCtrl label,
.content .dialog-content > form .form-section > .form-list .NumberCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .NumberCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .NumberCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .NumberCtrl label,
.content .dialog-content > form .form-section > .form-row .NumberCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .NumberCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .NumberCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .NumberCtrl label,
.dialog-content > form ul .JsonCtrl label,
.dialog-content > form .content ul.content-grid .JsonCtrl label,
.content .dialog-content > form ul.content-grid .JsonCtrl label,
.dialog-content > form .content ul.content-grid.with-icons .JsonCtrl label,
.content .dialog-content > form ul.content-grid.with-icons .JsonCtrl label,
.dialog-content > form .content ul.with-icons.content-grid .JsonCtrl label,
.content .dialog-content > form ul.with-icons.content-grid .JsonCtrl label,
.content .dialog-content > form .form-section > .form-list .JsonCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-list .JsonCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-list .JsonCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-list .JsonCtrl label,
.content .dialog-content > form .form-section > .form-row .JsonCtrl label,
.content .dialog-content > form .form-section > .content-grid.form-row .JsonCtrl label,
.content .dialog-content > form .form-section > .content-grid.with-icons.form-row .JsonCtrl label,
.content .dialog-content > form .form-section > .with-icons.content-grid.form-row .JsonCtrl label, .dialog-content > form div .StringCtrl label,
.dialog-content > form div .TextCtrl label,
.dialog-content > form div .SelectCtrl label,
.dialog-content > form div .MultiSelectCtrl label,
.dialog-content > form div .CombinedCtrl label,
.dialog-content > form div .NumberCtrl label,
.dialog-content > form div .JsonCtrl label {
  display: inline-block;
  width: 60px;
  float: none;
  padding: 0;
  margin: 0px 0 0 0;
  border: none;
  vertical-align: middle;
  font-size: 10px;
  color: #61618e;
  text-align: left;
}
/*
*	A Drawer Dialog 
*/
.dialog-content form .drawer-right {
  padding: 1rem 0;
}
.dialog-content form .drawer-right .drawer-item {
  display: block;
  font-size: 14px;
  line-height: 42px;
  margin: 0px;
  padding: 1rem 1rem;
  font-family: "Nunito Regular";
}
.dialog-content form .drawer-right p {
  padding: 0 1.4rem;
  line-height: inherit;
  font-size: inherit;
  padding: 0;
  display: block;
  color: #505079;
}
.dialog-content form .drawer-right button {
  font-family: inherit;
  display: inline-block;
  cursor: pointer;
  line-height: inherit;
  font-size: inherit;
  padding: 0;
  margin: 0px;
  background: none;
  border: none;
}
.dialog-content form .drawer-right button i {
  display: inline-block;
  width: 42px;
  height: 24px;
  color: #9b685f;
  font-size: 24px;
  text-align: center;
  vertical-align: top;
  padding: 0;
  margin-right: 1rem;
}
.dialog-content form .drawer-right button:hover {
  color: #ff5f40;
  font-weight: bold;
}
.dialog-content form .drawer-right button:hover i {
  color: #ff5f40;
}
.dialog-content form .drawer-right button.center {
  width: 90px;
  display: inline-block;
}
.dialog-content form .drawer-right hr {
  margin: 0px;
  border: none;
  border-bottom: 1px solid #a8a8aa;
}
.dialog-content form .drawer-right table {
  font-size: 12px;
  text-align: center;
  padding: 0;
  margin: 0 0 10px 0;
  color: #505079;
}
.dialog-content form .drawer-right table th {
  no-border-bottom: 1px dotted #aaa;
}
.dialog-content form .drawer-right table td {
  font-weight: normal;
  border-bottom: 10px solid transparent;
  vertical-align: top;
}
.dialog-content form .drawer-right table td span {
  display: inline-block;
  margin-top: 1px;
  padding: 4px 6px;
  border-radius: 6px;
}
.dialog-content form .drawer-right table td span.A {
  background-color: #00FF00;
}
.dialog-content form .drawer-right table td span.E {
  background-color: #ffeb3b !important;
}
.legacy-page {
  background-color: transparent !important;
}

.legacy-page .action-bar {
  display: none;
}
.legacy-page .action-bar > .actions-set {
  display: none;
}
.legacy-page .action-bar > .title {
  display: none;
}

.legacy-page .page-overlay {
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: -1;
  background-color: #5a5a5a;
  opacity: 0.7;
}

.legacy-sidebar {
  display: none;
}

.legacy-container .section {
  overflow: hidden;
  max-width: 720px;
  min-width: 300px;
  margin: auto !important;
  background-color: #ededea !important;
  box-shadow: 0 0 20px #111;
  padding: 0;
  position: relative;
  top: 110px;
}
.legacy-container .section .title {
  color: #222;
  padding-left: 2em;
}
.legacy-container .section .action-btn.cancel, .legacy-container .section .cancel.row-action-btn, .legacy-container .section .cancel.field-action-btn, .legacy-container .section .action-btn.CancelBtn, .legacy-container .section .CancelBtn.row-action-btn, .legacy-container .section .CancelBtn.field-action-btn {
  float: right;
  display: inline-block;
  margin-top: -10px;
  margin-right: -40px;
  color: #ab3a3a !important;
  border: none !important;
  background-color: transparent !important;
}
.legacy-container .section .action-btn.cancel > i, .legacy-container .section .cancel.row-action-btn > i, .legacy-container .section .cancel.field-action-btn > i, .legacy-container .section .action-btn.CancelBtn > i, .legacy-container .section .CancelBtn.row-action-btn > i, .legacy-container .section .CancelBtn.field-action-btn > i {
  color: inherit !important;
}
.legacy-container .section .action-btn.cancel:hover, .legacy-container .section .cancel.row-action-btn:hover, .legacy-container .section .cancel.field-action-btn:hover, .legacy-container .section .action-btn.CancelBtn:hover, .legacy-container .section .CancelBtn.row-action-btn:hover, .legacy-container .section .CancelBtn.field-action-btn:hover {
  color: #ff5f40 !important;
}

.legacy-form {
  background-color: #fff;
  padding: 2em 4em 2em 4em !important;
  margin-left: auto !important;
  margin-right: auto !important;
  position: initial;
  overflow-y: auto;
  z-index: -1;
}
.legacy-page.overlayed .legacy-form {
  z-index: 0;
  top: 0;
}

.legacy-form li {
  vertical-align: top;
}
.legacy-form li label.on-top {
  display: block;
  font-size: 13px;
  padding: 0;
  margin-bottom: 1px;
  margin-top: 0;
  color: #aaa;
}
.legacy-form li label {
  width: 12.5rem;
  display: inline-block;
  float: left;
  font-size: 13px;
  padding: 0;
  margin-top: 1px;
  color: #505079;
}
.legacy-form li.focus label {
  color: #2f2f2f;
  margin-top: 6px;
}
.legacy-form li.focus .hint {
  display: block;
}
.legacy-form li.focus .options {
  border-bottom: 2px solid #ff5f40 !important;
}
.legacy-form li select,
.legacy-form li input,
.legacy-form li textarea,
.legacy-form li .options {
  display: inline-block;
  margin-bottom: 0px;
  border: 0px solid transparent;
  border-bottom: 1px solid #ddd;
  color: #2f2f49;
  font-size: 17px;
  line-height: 140%;
}
.legacy-form li select:focus,
.legacy-form li input:focus,
.legacy-form li textarea:focus,
.legacy-form li .options:focus {
  border-bottom: 2px solid #ff5f40;
  color: #000;
  outline: 0 !important;
}
.legacy-form h2 input {
  display: inline-block;
  margin-bottom: 0px;
  border: 0px solid transparent;
  border-bottom: 1px solid #ddd;
  color: #2f2f49;
  line-height: 140%;
}
.legacy-form h2 input:focus {
  margin-bottom: 0px;
  border-bottom: 2px solid #ff5f40;
  color: #000;
  outline: 0 !important;
}
.legacy-form h2 .hint {
  display: block;
  color: #333;
  font-size: 1.2rem;
  margin-bottom: 20px;
}
.legacy-form li select {
  padding: 4px 0;
  background: none;
  margin-top: -3px;
}
.legacy-form li textarea {
  width: 100%;
  padding: 0;
  padding-bottom: 8px;
}
.legacy-form li p.hint {
  display: none;
  clear: both;
  font-size: 11px;
  color: #888;
  padding: 0;
  margin-left: 90px;
  max-width: 95%;
  line-height: 150%;
  margin-top: 6px;
}
.legacy-form li p.image-container {
  padding: 0;
}
.legacy-form li p.image-container img {
  border: 1px solid #aaa;
  max-width: 240px;
}
.legacy-form li.MultiSelectCtrl {
  margin-bottom: 10px !important;
  max-width: 520px;
}
.legacy-form li.MultiSelectCtrl label {
  margin-top: 8px;
}
.legacy-form li.MultiSelectCtrl select {
  width: 34px;
  border: 1px solid #78739a;
  border-radius: 4px;
}
.legacy-form li.MultiSelectCtrl select:focus {
  font-size: inherit;
  border: 1px solid #ff5f40;
}
.legacy-form li.MultiSelectCtrl .options {
  display: inline;
  color: #2f2f49;
  font-size: 16px;
  line-height: 32px;
  min-height: 31px;
  max-width: 360px;
  margin-bottom: 8px;
  padding-bottom: 1px;
  border: none !important;
}
.legacy-form li.MultiSelectCtrl .options .option {
  margin-right: 1px;
  display: inline-block;
  padding: 0px 0 0px 8px;
  font-size: 15px;
  line-height: 28px;
  vertical-align: bottom;
  border: 1px solid #bbb;
  border-radius: 4px;
}
.legacy-form li.MultiSelectCtrl .options .option i {
  border: none;
  border-left: 1px solid #bbb;
  margin-left: 6px;
  width: 20px;
  height: 28px;
  display: inline-block;
  font-size: 11px;
  vertical-align: bottom;
  text-align: center;
  line-height: 28px;
  font-style: normal;
}
.legacy-form li.JsonCtrl button.small {
  font-size: 12px;
  font-weight: bold;
  padding: 4px 8px;
  line-height: 18px;
}
.legacy-form li.JsonCtrl button.small i {
  font-size: 18px;
  vertical-align: middle;
}
.legacy-form li.JsonCtrl button.xsmall {
  font-size: 10px;
  font-weight: bold;
  padding: 4px 4px;
  line-height: 16px;
}
.legacy-form li.JsonCtrl button.xsmall i {
  font-size: 16px;
  vertical-align: middle;
}
.legacy-form li.JsonCtrl p.lines {
  margin-left: 90px;
}
.legacy-form li .aside-content {
  width: 100%;
  display: block;
  padding: 0.5em 0;
  font-size: 10pt;
  line-height: 160%;
  border-left: 1px dotted #0084fd;
  margin-left: 6px;
  padding-left: 1rem;
  color: #333;
}
.legacy-form li .aside-content u.br {
  display: block;
  font-size: inherit;
  line-height: 60%;
  color: transparent;
}
.legacy-form .form-buttons {
  text-align: right;
  border-top: 8px dotted #ddd;
  margin: 3em -20px 0 -20px;
  padding: 1em 0em 0 1em;
}
.legacy-form .form-buttons button {
  color: #ab3a3a;
  font-size: 18px;
  vertical-align: middle;
  border: none;
  background: none;
}
.legacy-form .form-buttons button i {
  color: inherit;
  font-size: inherit;
  margin-right: 0.5em;
}
.legacy-form .form-buttons button:hover {
  font-weight: bolder;
}
.legacy-form .form-buttons button.close {
  float: right;
}

.legacy-page.overlayed .legacy-form {
  position: relative;
}

.admins-home-breadcrumbs,
.tabs-breadcrumbs {
  color: #eee;
  font-family: "Nunito Regular";
  font-size: 12pt;
}

table.admins-home-modules {
  margin-top: 3em;
}
table.admins-home-modules td {
  vertical-align: top;
  border-right: 1px dotted #bdc5de;
  text-align: center;
  overflow: hidden;
}
table.admins-home-modules td .content-grid.with-icons {
  padding-left: 0;
  text-align: center;
}
table.admins-home-modules td .content-grid.with-icons li {
  margin-right: 0;
}
table.admins-home-modules td:last-child {
  border-right: 1px solid transparent;
}

/*
*   Patches para la pagina de Login
*/
#login-page .login-backg {
  position: absolute;
  top: 0%;
  right: 0%;
  bottom: 0%;
  left: 0%;
  opacity: 1;
  background-image: url(../img/custom/treme/login-backg.jpg);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: cover;
}
#login-page input {
  font-family: "Helvetica", sans-serif;
  font-size: 16px;
}
#login-page input:focus {
  border: 2px solid red;
}

form.my-login label, form.my-registration label {
  margin-bottom: 8px;
}
form.my-login input, form.my-registration input {
  font-size: 16px;
  padding: 10px !important;
  width: 90%;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  padding-left: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0.9em;
}
form.my-login input:focus, form.my-registration input:focus {
  box-shadow: 0 0 12px #333;
  font-size: 18px;
  padding-left: 0.6em !important;
  padding-bottom: 0.5em !important;
}
form.my-login .dialog-btn.login, form.my-login .dialog-btn.registrate, form.my-registration .dialog-btn.login, form.my-registration .dialog-btn.registrate {
  color: #2f2f2f;
  font-size: 18px;
  font-weight: bold;
  margin: 0;
  padding: 2px 16px 4px 16px;
  line-height: 34px;
  width: 100%;
}
form.my-login .dialog-btn.login i, form.my-login .dialog-btn.registrate i, form.my-registration .dialog-btn.login i, form.my-registration .dialog-btn.registrate i {
  display: inline-block;
  vertical-align: top;
  margin-right: 10px;
  font-size: 24px;
  height: 24px;
}
form.my-login .dialog-btn.login:hover, form.my-login .dialog-btn.registrate:hover, form.my-registration .dialog-btn.login:hover, form.my-registration .dialog-btn.registrate:hover {
  font-size: 18px;
  margin: 0;
}

#process-def-page .container {
  margin: 0px 0;
  position: relative;
  display: block;
}
#process-def-page .section.current {
  margin: 0;
  overflow-x: auto;
  /*
  position: fixed;
    	top: 0px;
    	left: 0;
    	right: 0;
    	bottom: 0;
     padding-top: 111px;
    	background: transparent;
  */
}
#process-def-page .title {
  /* Process state colors */
  /* Process version */
}
#process-def-page .title .process-state {
  padding: 0;
  font-size: 22px;
  margin-left: 0.6em;
  display: inline-block;
}
#process-def-page .title .process-state.started {
  color: #00FF00;
}
#process-def-page .title .process-state.stopped {
  color: red;
}
#process-def-page .title .process-def-version {
  font-size: 14px;
  font-weight: bold;
}

.process-def-board {
  display: inline-block;
  margin: 5px 0 0 0;
  padding: 2em 2em 2em 2em;
  width: 3200px;
}

.add-stage-btn {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  width: 180px;
  padding: 0 1em 1em 1em;
  font-size: 18px;
  border-radius: 9px;
  text-align: center;
  cursor: pointer;
  margin-top: 2px;
  margin-left: 10px;
  border: 3px dashed #99c599;
  color: #4eba4e;
}
.add-stage-btn p {
  font-size: inherit;
  color: inherit;
  text-align: center;
}
.add-stage-btn i {
  font-size: 46px;
  display: inline-block;
  margin: 0.5em;
  color: inherit;
  opacity: 0.8;
}
.add-stage-btn:hover {
  color: #ff5f40;
  border-color: #ff5f40;
}

.stage-def {
  width: 270px;
  display: inline-block;
  vertical-align: top;
  text-align: center;
  margin-right: 8px;
  background-color: #fff;
  border-radius: 4px;
  box-shadow: 0px 0px 4px #aaa;
}
.stage-def > .stage-def-header {
  position: relative;
  box-sizing: border-box;
  background-color: #fff;
  height: 62px;
  padding: 16px 8px 16px 16px;
  margin: 0;
  text-align: left;
  border-radius: 8px 8px 0px 0px;
  border-bottom: 1px solid #ddd;
}
.stage-def > .stage-def-header input {
  position: relative;
  box-sizing: border-box;
  float: left;
  height: 30px;
  line-height: 30px;
  width: 14rem;
  margin: 0px;
  padding: 0px;
  margin-left: 8px;
  font-family: "Nunito Regular";
  background-color: transparent;
  color: #222;
  font-size: 20px;
  font-weight: normal;
  border: none;
}
.stage-def > .stage-def-header input:focus {
  background-color: #fff;
  padding: 4px;
}
.stage-def > .stage-def-header .stage-options-btn {
  position: relative;
  float: right;
  box-sizing: border-box;
  margin: 0;
  width: 30px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
  color: #ab3a3a;
  text-align: center;
}
.stage-def > .stage-def-header .stage-options-btn i {
  vertical-align: middle;
}

.activity-def {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: transparent;
}
.activity-def .activity-rules {
  margin: 0;
  padding: 0;
}
.activity-def .activity-rules .activity-rules-is-empty {
  padding: 16px 24px 0 24px;
  font-size: 16px;
  text-align: left;
  color: #8e8e8f;
}
.activity-def .activity-rules .activity-rule-item {
  display: block;
  margin: 0;
  margin-bottom: 0px;
  padding: 16px 24px;
  text-align: left;
  line-height: 180%;
  overflow: hidden;
  white-space: nowrap;
  font-size: 14px;
  font-weight: normal;
  color: #888;
  border-bottom: 1px solid #ddd;
}
.activity-def .activity-rules .activity-rule-item:hover {
  background-color: #fff;
  box-shadow: 0px 0px 12px #ddd;
}
.activity-def .activity-rules .activity-rule-item:hover .activity-rule {
  color: #ff5f40;
  text-decoration: underline;
}
.activity-def .activity-rules .activity-rule-item .activity-rule {
  color: #222;
  font-weight: bold;
  font-size: 16px;
  line-height: 24px;
  display: inline;
  padding: 0;
  cursor: pointer;
}
.activity-def .activity-rules .activity-rule-item .activity-rule:hover {
  color: #ff5f40;
  text-decoration: underline;
}
.activity-def .activity-rules .activity-rule-item .activity-rule-action {
  font-size: 12px;
  line-height: 18px;
  font-weight: normal;
  padding: 0 0.5rem 0 0;
  color: #999;
}
.activity-def .activity-rules .activity-rule-item .activity-rule-action .activity-transition-icon {
  font-size: 1.1rem;
  font-weight: normal;
  padding: 0 0.5rem 0 0;
}
.activity-def .activity-rules .activity-rules-footer {
  text-align: left;
  padding: 16px 24px 16px 24px;
  margin: 0;
  box-sizing: border-box;
}
.activity-def .activity-rules .activity-rules-footer .activity-rules-add-btn {
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 4px 8px;
  line-height: 24px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  color: #ab3a3a;
}
.activity-def .activity-rules .activity-rules-footer .activity-rules-add-btn i {
  font-size: inherit;
  color: inherit;
}
.activity-def .activity-rules .activity-rules-footer .activity-rules-add-btn:hover {
  color: #ff5f40;
  background-color: #e8e8ff;
  border-radius: 4px;
}

/*
*
*/
.activity-rule-def-dialog {
  padding: 1em 2em;
  font-size: 10pt;
  position: relative;
}
.activity-rule-def-dialog .activity-rule-def-dialog-close-btn {
  margin-top: -40px;
  margin-right: -30px;
  border-bottom: 1px solid #eee;
  border-left: 1px solid #eee;
  padding: 0.5rem 0.8rem;
}
.activity-rule-def-dialog .activity-rule-def-dialog-close-btn:hover {
  background-color: #eef;
}
.activity-rule-def-dialog .rule-def-header .rule-def-title {
  padding: 4px;
  width: 600px;
  border: 1px solid transparent;
  color: #059c5e;
  font-size: 16pt;
}
.activity-rule-def-dialog .rule-def-header .rule-def-title:focus {
  color: #565659;
  border: 1px solid #ddd;
}
.activity-rule-def-dialog .rule-def-header select {
  padding: 6px 2px;
  border: none;
  background-color: transparent;
  color: blue;
}
.activity-rule-def-dialog .rule-def-condition-editor {
  border: 0px solid #777;
  margin-bottom: 0em;
  display: block;
  padding: 0;
  border-left: 2px solid #ccc;
  margin-bottom: 0em;
  margin-left: 6px;
  padding-left: 1rem;
}
.activity-rule-def-dialog .rule-def-condition-editor .vars-list {
  padding: 0;
  margin: 0;
  background-color: transparent;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-content {
  border: 0px solid #666;
  background-color: #fff;
  border-radius: 0px;
  margin-top: 8px;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-content .option {
  border-radius: 4px;
  border: 1px solid #ddd !important;
  border-color: 1px solid #ddd;
  background-color: #eef;
  line-height: 18px;
  font-size: 1.05rem;
  display: inline-block;
  padding: 2px 1px 2px 0.6rem;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-content .option .descr {
  font-family: monospace;
  font-weight: normal;
  font-size: 12px;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-content .option input[type=checkbox] {
  margin-left: 5px;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-content .option .option-remove-btn {
  display: inline-block;
  color: #ab3a3a;
  border: 1px solid #ccc;
  padding: 0 4px 0 4px;
  background: none;
  border-radius: 2px;
  line-height: 15px;
  font-size: 13px;
  margin-left: 0.4rem;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-toolbar {
  padding: 0 0 0 1rem;
}
.activity-rule-def-dialog .rule-def-condition-editor label {
  margin-top: 4px;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-selector {
  vertical-align: bottom;
  max-width: 14rem;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-input {
  padding: 0 1rem;
  line-height: 26px;
  vertical-align: bottom;
}
.activity-rule-def-dialog .rule-def-condition-editor .formula-editor-button {
  line-height: 8px;
  vertical-align: bottom;
  margin-left: -5px;
  padding-right: 4px;
  padding-left: 6px;
}
.activity-rule-def-dialog .action-add-btn {
  color: #ab3a3a;
  border: none;
  padding-left: 0px;
  font-weight: bold;
}
.activity-rule-def-dialog .rule-def-actions-list {
  max-height: 20rem;
  overflow-y: auto;
  padding: 0 0 0 1rem;
}
.activity-rule-def-dialog .rule-def-action {
  width: 98%;
  line-height: 24px;
  /* background-color: #eee; */
  margin: 0;
  margin-bottom: 12px;
  color: #80808f;
}
.activity-rule-def-dialog .rule-def-action span {
  no-display: inline-block;
}
.activity-rule-def-dialog .rule-def-action select, .activity-rule-def-dialog .rule-def-action input[type=date], .activity-rule-def-dialog .rule-def-action input[type=number], .activity-rule-def-dialog .rule-def-action .email-composer-open-button {
  padding: 4px 6px;
  border: none;
  background-color: #e8e8ff;
  vertical-align: middle;
}
.activity-rule-def-dialog .rule-def-action .email-composer-open-button {
  color: #000;
  font-size: 1rem;
  font-weight: normal;
}
.activity-rule-def-dialog .rule-def-action .email-composer-open-button i {
  margin-left: 1rem;
  color: inherit;
  vertical-align: middle;
}
.activity-rule-def-dialog .rule-def-action .action-remove-btn {
  display: inline-block;
  color: #ab3a3a;
  border: 1px solid #ccc;
  background: none;
  line-height: 12px;
  font-size: 16px;
  padding: 4px 6px 6px 6px;
  border-radius: 4px;
  vertical-align: bottom;
}
.activity-rule-def-dialog .rule-def-action .action-remove-btn i {
  color: inherit;
  font-size: inherit;
}
.activity-rule-def-dialog .rule-def-functions-btn {
  border: none;
  background: none;
  color: blue;
  padding: 7px;
  width: 18em;
}
.activity-rule-def-dialog .rule-def-syntax-check-btn {
  padding: 6px 1em;
  margin-top: -5px;
  float: left;
}
.activity-rule-def-dialog .rule-def-condition-errors,
.activity-rule-def-dialog .rule-def-actions-errors {
  padding: 5px 1em;
  margin: 0 1em 10px 0;
  display: block;
  font-family: "Nunito Light", "UI", "Helvetica", sans-serif;
  font-size: 14px;
}
.activity-rule-def-dialog .rule-def-condition-errors.syntax-ok,
.activity-rule-def-dialog .rule-def-actions-errors.syntax-ok {
  color: green;
}
.activity-rule-def-dialog .rule-def-condition-errors.syntax-errors,
.activity-rule-def-dialog .rule-def-actions-errors.syntax-errors {
  color: red;
  line-height: 22px;
}
.activity-rule-def-dialog .rule-def-condition-errors.syntax-errors b,
.activity-rule-def-dialog .rule-def-actions-errors.syntax-errors b {
  border: 1px solid #777;
  padding: 3px;
}

/*
*   Form Patches
*/
.form-toc {
  display: inline-block;
  float: right;
  clear: both;
  padding: 0;
  margin-top: 0;
  margin-left: 20px;
  border-left: 30px solid #fff;
  background-color: #fff;
  width: 180px;
  z-index: 6;
}
.form-toc .tabs {
  margin: 0;
  padding: 20px 0 20px 30px;
  border-left: 2px dotted #aaa;
}
.form-toc a {
  display: block;
  text-align: left;
  padding: 4px 0px;
  margin: 6px 12px 6px 0;
  font-size: 1rem;
  color: #aaa;
  cursor: pointer;
  clear: both;
  float: none;
  border-bottom: 1px dotted #aaa;
}
.form-toc a:hover {
  background-color: #999;
  color: #fff;
  padding-left: 6px;
  margin-left: -6px;
  border-bottom: 1px solid transparent;
}
.form-toc a.selected {
  background-color: #111;
  color: #fff;
  padding: 8px 8px 8px 12px;
  margin-left: -12px;
  margin-top: 3px;
  margin-bottom: 3px;
  margin-right: 4px;
}

/*
*   Entity: List Form special styles
*/
#list-file-table {
  overflow: auto;
  width: 100%;
  padding: 0;
  margin: 0;
  font-size: 8pt;
  line-height: 140%;
}
#list-file-table th, #list-file-table td {
  padding: 0.3em;
  text-align: center;
  color: #333;
  font-size: 8pt;
  overflow: hidden;
}
#list-file-table th {
  background-color: #eee;
  border: 1px solid #CCF;
  border-bottom: 1px solid #333;
  padding: 12px;
}
#list-file-table td {
  border: 1px solid #ddd;
}

#list-def-page form {
  min-width: 720px;
}
#list-def-page form .form-subsection {
  /*
  *   A small subsection inside a form section
  *   Can be floating blocks inside a section
  */
  display: block;
  vertical-align: top;
  margin: 0em 5px;
  padding: 5px 0 5px 0px;
}
#list-def-page form .form-subsection h4 {
  margin-top: 4px;
  margin-bottom: 1em;
  padding-bottom: 6px;
  border-bottom: 1px solid #505079;
  cursor: pointer;
  color: #059c5e;
}
#list-def-page form .form-subsection h4 > span.selected {
  border-bottom: 5px solid #c2e7d8;
  display: inline-block;
  padding-bottom: 4px;
  margin-bottom: -6px;
}
#list-def-page form .form-subsection h4 i.icon {
  display: inline-block;
  vertical-align: initial;
}
#list-def-page form .form-subsection h4.selected {
  border-bottom-color: #c2e7d8;
}
#list-def-page form .form-subsection h4.selected i.icon {
  color: #dededa;
}
#list-def-page form .form-subsection p.tips {
  padding-right: 0em;
  width: 160px;
  float: right;
}
#list-def-page form .form-subsection ul, #list-def-page .content form .form-subsection .form-section > .form-list, .content #list-def-page form .form-subsection .form-section > .form-list, #list-def-page .content form .form-subsection .form-section > .form-row, .content #list-def-page form .form-subsection .form-section > .form-row {
  min-width: 480px;
  max-width: 720px;
  display: inline-block;
}

#list-def-page .list-content-refresh-btn {
  margin-right: 0em;
  margin-left: 0em;
}
#list-def-page .list-content-refresh-btn {
  display: inline-block;
  width: 32px;
  height: 32px;
  font-size: 24px;
  vertical-align: middle;
  text-align: center;
}
#list-def-page .list-content-file-link {
  display: inline-block;
  width: 22rem;
  font-weight: normal;
  font-size: 1.1rem;
  line-height: 1rem;
  max-height: 2rem;
  padding-left: 4rem;
  padding-right: 4rem;
  vertical-align: middle;
}
#list-def-page .list-content-file-link img {
  width: 26px;
  height: 26px;
  float: left;
  margin-left: -32px;
}
#list-def-page #list-uploader input {
  color: ORANGERED;
}
#list-def-page #list-uploader button {
  padding: 4px 1.2em;
  font-family: Helvetica;
  font-size: 16px;
}
#list-def-page .option-block {
  margin-bottom: 3px;
  display: block;
}
#list-def-page .option-block .option-label {
  font-weight: bold;
  font-size: 9pt;
  float: left;
  clear: both;
  padding-top: 4px;
  width: 70px;
  display: block;
  vertical-align: top;
}
#list-def-page .option-block .option-content {
  display: block;
  font-size: 9pt;
  vertical-align: top;
  margin-left: 76px;
}
#list-def-page .option-block .option-content b {
  display: inline-block;
  padding: 4px 8px;
  font-size: inherit;
  font-style: normal;
  font-weight: normal;
  margin-right: 0.5em;
  margin-bottom: 1px;
  border: 1px solid #d9d9ed;
  border-radius: 4px;
}

/*
 * AREA DE TRABAJO donde se edita el formulario
*/
.form-editor {
  display: block;
  clear: both;
  margin: 0em 0;
  text-align: left;
}
.form-editor ::-webkit-scrollbar {
  width: 10px;
}
.form-editor ::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  border-radius: 0px;
}
.form-editor ::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

/*
 *   TOOLBAR del EDITOR
 *   donde estan las herramientas para editar el formulario
*/
.form-editor .editor-bar {
  display: inline-block;
  --float:left;
  width: 320px;
  height: 600px;
  margin-left: 1em;
  font-size: 8pt;
  no-border: 1px solid red;
}

.form-editor .editor-bar #form-editor-toolbar {
  margin-top: 0;
}

.form-editor .editor-bar h2 {
  display: block;
  margin: 0.8em 0;
  font-size: 1.4em;
  color: #444;
}

.form-editor .editor-bar h3 {
  display: block;
  margin: 0.8em 0;
  font-size: 1.2em;
  font-weight: normal;
  color: #444;
}

/* Paneles que contienen opciones y botones de edicion */
.form-editor .editor-bar .pane {
  display: block;
  text-align: left;
  font-size: 1em;
  border: 1px solid #ccc;
  border-radius: 1em;
  background-color: #f1f1f1;
  padding: 1em;
  margin-bottom: 1em;
  text-align: left;
}

.form-editor .editor-bar .pane h3 {
  font-size: 1em;
  margin: 0.1em 0;
  padding: 0 0 0.6em 0;
  font-weight: bold;
}

.form-editor .editor-bar .pane h4 img {
  vertical-align: middle;
  height: 0.8em;
  float: right;
  display: inline-block;
}

/* SUBPANEL DENTRO de un cierto panel y sus botones */
/* handle para mostrar ocultar el subpanel */
.form-editor .editor-bar h4 {
  margin: 0em;
  padding: 0.5em 0.5em 0.5em 1.5em;
  vertical-align: middle;
  line-height: 1.4em;
  font-weight: bold;
  font-size: 1.4em;
  color: #0E75C9;
  background: url("../img/extras/pointer-right-small.png") no-repeat center left;
}

.form-editor .editor-bar h4.selected {
  color: #333;
  background: url("../img/extras/pointer-down-small.png") no-repeat center left #fff;
}

/* subpanel */
.subpane {
  border: none;
  padding: 0.5em 0.5em 0em 0.5em;
  display: block;
  background-color: #fff;
  margin-top: 2px;
}

.subpane.tabbed {
  border: 0px solid #ccc;
  background-color: transparent;
}

/* titulo dentro del subpanel */
.subpane h4 {
  font-size: 1.2em;
  padding: 0.5em;
  margin: 0;
}

/* botones para accion dentro del subpanel */
.subpane button {
  width: 60px;
  border: 1px dotted red;
}

.subpane button.selected {
  background: none;
  background-color: #fff;
  border-bottom: 0px solid #fff;
  padding-bottom: 10px;
}

.subpane button p {
  font-size: 0.8em;
  font-weight: normal;
  line-height: 1em;
}

/* parrafo de texto dentro del subpanel */
.subpane p {
  padding: 0;
  margin: 0;
  font-size: 1em;
  font-weight: normal;
  line-height: 1em;
}

/* un separador de grupos de botones dentro del subpanel */
.subpane p.separator {
  padding: 0;
  margin: 0;
  --font-size:0.1em;
  --line-height:0.2em;
  height: 0.3em;
}

/*
*   AREA PARA EL EMULADOR del dispositivo
*/
.form-editor .device-emulator {
  /* el contenedor del emulador propiamente dicho */
  display: block;
  padding: 0px;
  vertical-align: top;
  text-align: right;
  vertical-align: top;
  position: absolute;
  top: 111px;
  bottom: 0;
  right: 50%;
  /*
  padding: 30px 30px 50px 30px;
  border: 0px solid #c1c2cd;
  border-radius: 22px;
  padding: 7px 9px 50px 6px;
  background-color: #a2b7c9;
  border-radius: 10px;
  */
  border-radius: 15px 15px 0px 0px;
  box-shadow: 0 0 31px #6f72a2;
  padding: 48px 8px 2px 4px;
  background-color: #607D8B;
}

.form-editor .device-emulator-contexts {
  /* al area pegada al device que muestra ayudas y contextos ...*/
  position: absolute;
  left: 52%;
  /* top: 0; */
  width: 420px;
  text-align: left;
}
.form-editor .device-emulator-contexts > .context {
  padding-left: 2em;
  margin-top: 48px;
}
.form-editor .device-emulator-contexts img.flecha {
  position: relative;
  top: 4px;
  left: -50px;
  z-index: 3;
}
.form-editor .device-emulator-contexts p {
  padding: 0 0 10px 0;
  font-size: 16px;
  line-height: 26px;
}
.form-editor .device-emulator-contexts p.indented {
  padding-left: 1em;
  text-align: left;
}
.form-editor .device-emulator-contexts p.hint {
  font-size: 14px;
  line-height: 20px;
}
.form-editor .device-emulator-contexts .aside {
  font-size: 14px;
}
.form-editor .device-emulator-contexts .pointer {
  position: absolute;
  top: 200px;
  left: -6px;
  display: none;
}
.form-editor .device-emulator-contexts .tip {
  color: #fff;
  background-color: #ccc;
  border-radius: 10px;
  font-size: 12px;
  padding: 0px 8px;
  display: inline-block;
  line-height: 21px;
}
.form-editor .device-emulator-contexts .tip:hover {
  background-color: #333;
}

/*
gt-240 gt-320 gt-480 gt-640 gt-768 gt-800 
lt-1024 lt-1280 lt-1440 lt-1680 lt-1920
*/
.form-editor {
  padding-right: 50%;
  text-align: right;
}

.form-editor .device-emulator {
  display: inline-block;
  /*position: relative;*/
}

/*
html.lt-1024 {
    // Estilos para los Breakpoint  "640 =< width < 1024"
    .form-editor .device-emulator { margin: initial; }
}
html.gt-1024.lt-1280 {
    // Estilos para los Breakpoint  "640 =< width < 1024"
    .form-editor { padding-right: 250px; }
    .form-editor .device-emulator { margin: auto; }
}
html.gt-1280.lt-1440 {
    // Estilos para los Breakpoint  "640 =< width < 1024"
    .form-editor { padding-right: 120px; }
    .form-editor .device-emulator { margin: auto; }
}
html.gt-1440 {
    // Estilos para los Breakpoint  "640 =< width < 1024"
    .form-editor { padding-right: 0px; }
    .form-editor .device-emulator { margin: auto; }
}
*/
.form-editor .device-emulator .device-display {
  /* el display del dispositivo, independiente de la orientacion */
  display: block;
  position: relative;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: #fff;
  border: 2px solid #5e5e5e;
  border-bottom: 0px solid #5e5e5e;
  text-align: left;
  font-size: 10pt;
  z-index: 1;
}

.form-editor .device-emulator .device-btns {
  /*** el boton que simula el back ***/
  display: block;
  margin-top: 4px;
  width: 100%;
  line-height: 26px;
  color: #111;
  font-size: 16pt;
  text-align: center;
  vertical-align: middle;
}

/*
*   Botones para Agregar secciones y campos muy usados aqui ...
*/
.add-field-btn,
.add-section-btn {
  color: #8a8;
  border: 1px dashed #8a8 !important;
  border-radius: 10px;
  padding: 6px;
  line-height: 18px;
  font-size: 12px !important;
  width: 52px;
  display: inline-block;
  text-align: center;
  margin-bottom: 2px;
  margin-right: 2px;
}
.add-field-btn i,
.add-section-btn i {
  color: inherit;
  font-size: 18px;
}
.add-field-btn:hover,
.add-section-btn:hover {
  border-color: #ff5f40 !important;
  color: #ff5f40;
}
.add-field-btn.big,
.add-section-btn.big {
  font-size: 14px !important;
  border: 2px dashed #8a8 !important;
  padding: 0.5em;
  width: 116px;
  line-height: 22px !important;
}
.add-field-btn.big i,
.add-section-btn.big i {
  font-size: 32px !important;
}
.add-field-btn.small,
.add-section-btn.small {
  border: 2px dotted #8a8 !important;
  border-radius: 10px;
  padding: 0 10px;
  font-size: 14px;
}

.medium-add-field-btn,
.medium-add-section-btn {
  color: #8a8;
  border: 2px dashed #8a8;
  border-radius: 7px;
  padding: 7px;
  font-size: 14px;
  width: 48px;
  display: inline-block;
  text-align: center;
  line-height: 22px;
}
.medium-add-field-btn i,
.medium-add-section-btn i {
  color: inherit;
  /*#56565d*/
  font-size: 32px;
}
.medium-add-field-btn:hover,
.medium-add-section-btn:hover {
  border-color: #ff5f40;
  color: #ff5f40;
}
.medium-add-field-btn:hover i,
.medium-add-section-btn:hover i {
  color: #ff5f40;
}

.small-add-field-btn,
.small-add-section-btn {
  color: #8a8;
  border: 2px dotted #8a8;
  border-radius: 10px;
  padding: 0 10px;
  font-size: 14px;
  display: inline-block;
  text-align: center;
  line-height: 22px;
}
.small-add-field-btn:hover,
.small-add-section-btn:hover {
  border-color: #ff5f40;
  color: #ff5f40;
}

/* variantes en el factor de forma y orientación para diferentes dispositivos */
.device-emulator.phone.portrait {
  width: 320px;
  /* default de un phone */
  max-height: 484px;
  /* agregar 8px por el borde del display */
  font-size: 10pt;
}

.device-emulator.tablet7.portrait {
  width: 480px;
  /* default de una tablet de 7" */
  max-height: 800px;
  font-size: 8pt;
}

.device-emulator.tablet7.landscape {
  width: 800px;
  /* default de una tablet de 7" */
  max-height: 480px;
  font-size: 10pt;
}

/*
 * AREA DE CONTENIDO DENTRO DEL DISPLAY DEL DISPOSITIVO
 */
.device-display .page-header {
  display: none;
  font-size: 1.2em;
  color: #fff;
  background-color: #000;
  padding: 1em;
  text-align: center;
  height: 36px;
  line-height: 32px;
  border-bottom: 4px solid #1AFF00;
}

.device-display .page-content {
  margin: 0;
  padding: 0;
  height: inherit;
}

.device-display .page-content .empty {
  display: none;
}

.device-display .page-content.empty .empty {
  display: block;
}

.device-display .page-content.empty .empty p {
  font-size: 10.5pt;
  line-height: 1.3;
  margin: 0;
  color: #333;
  background-color: #E8FFEE;
  border-bottom: 4px solid #fff;
  padding: 1em;
}

.device-display .page-content.empty .empty p img {
  margin: 0.6em 0 0 0.6em;
  border: 1px DASHED orange;
  padding: 0.4em;
  background-color: white;
}

.device-display .page-content .container {
  margin: 0 !important;
  padding: 0;
  height: inherit;
  padding-top: 1em;
}

.device-emulator.tablet7.landscape .container {
  /* cuando estamos en tablet, landscape, debemos
     simular el sidebar, que NO mostramos en otros casos */
  margin-left: 30%;
  border-left: 1px solid #ccc;
}

/*
 *  AREA DE EDICION y BLOCKS DENTRO de la misma
 *  El area de edicion se setea dinamicamente usando JS
 *  en FormEditorPage(), para simplificar el usos de
 *  estilos
 */
.editarea {
  padding: 0.5em;
  margin-left: 0 !important;
  font-size: 8pt !important;
  /* forzar el uso de font pequño en la edicion */
  font-style: normal;
}

/* Block: Form-section GENERICA dentro de la Editarea */
.editarea .form-section {
  margin-left: 20px;
}

.editarea .form-section.selected {
  margin-left: 13px !important;
  border-left: 6px solid #D9DAC5;
  padding-left: 5px;
}

.editarea .form-section textarea[name=data] {
  display: none;
  /* ocultar esto siempre ! */
}

/* Block: Section dentro de la Editarea */
/* Block: List dentro de la Editarea */
.editarea .form-section.selected li.handle {
  /* cuando cualquier item de la seccion esta seleccionada */
}
.editarea .form-section.selected li.handle.selected {
  background-color: #D9DAC5;
}

/* Block: Paragraph dentro de la Editarea
   hereda alguna props de Form-section*/
.editarea .form-section.paragraph {
  /* hay que eliminar algo de decoraciones */
  border: none;
  background: #fff;
}

.editarea .form-section.paragraph.selected {
  background-color: #D9DAC5;
}

.editarea .form-section.paragraph > p {
  font-size: 1.2em;
  padding: 0.4em;
}

/* Item seleccionado dentro de la Editarea */
.editarea .form-section li.selected {
  background-color: #D9DAC5;
}

/* CheckCtrl dentro del Editarea */
.editarea .form-section li a[href="#check-ctrl"] p.value {
  border: none;
}

.editarea .form-section li a[href="#check-ctrl"] p.value img {
  height: 22px;
  width: 22px;
  border: none;
}

/*
*   Importado tal cual de "forms.css"
*   pero incluido dentro de form-editor para mantener compatibilidad
*   con version 1 del Diseñador de Formularios
*/
.form-editor {
  /*
   * STATIC & STANDARD FORMS
  */
  /* labels en distintas variantes */
  /* items de lista y parrafo dentro de un form */
  /* hints para los campos dentro de un form */
  /* parrafo de opciones dentro de un MultiSelectCtrl */
  /*
   * DYNAMIC FORMS
  */
  /* un item stnadrad dentro del form */
  /* Divisor usado como titulo dentro de una lista */
  /* label standard */
  /* label que usa todo el ancho */
  /* indicar campo requerido */
  /* hints dentro del area del campo */
  /* valor del control standard */
  /* valor del control standard */
  /* valor de un campo de texto */
  /* galeria de fotos */
  /*
  form.dynamic li .wide p.value.gallery button {
      padding:0.5em;
      text-align: center;
  }
  form.dynamic li .wide p.value.gallery button img {
      height:24px;width:24px;
      vertical-align: middle;
      display: inline-block;
      margin:0;padding:0;
  }
  */
  /*
   *  LIST_BLOCK y sus FIELDS
   *  Los campos (li) se muestra horizontalmente dentro del bloque
   *  Se debe estructurar como:
   *
   *      div.form-section
   *          ul.list-block
   *              li.handle
   *              li
   *                   tr.fields
   *                      los campos (td)
   */
  /* encabezados genericos */
  /* celdas genericas para todos los campos */
  /* Ecabezados de distintos tipos de campos */
  /* Celdas para los distintos tipos de campos */
  /* el primer campo es un poco mas ancho que el resto, y
     ademas está alienado a la izquierda */
  /* CHECKBOX CONTROL */
  /* OPTIONS CONTROL */
  /* LIST ITEM CONTROL */
  /*
  * ANY CONTROL DIALOG
  * usado para editar el valor de un campo
  */
  /*
  *   SELECTION LIST CONTROL DIALOG
  */
  /*
  *   CALENDAR CONTROL DIALOG
  */
  /*
  *   NUMERIC KEYBOARD DIALOG
  */
  /*
  *   PHOTO CONTROL DIALOG
  */
}
.form-editor form no-button {
  padding: 1em;
  font-size: 1em;
  font-weight: bold;
}
.form-editor form input,
.form-editor form textarea {
  padding: 0.3em;
  font-size: 1.2em;
  line-height: 26px;
  border: 1px solid orange;
  border-radius: 3px;
}
.form-editor form select {
  padding: 0.4em;
  font-size: 1.2em;
  border: 1px solid orange;
  border-radius: 0px;
  max-width: 15em;
}
.form-editor form label.checkbox {
  background-position: center left;
  background-repeat: no-repeat;
  padding-left: 32px;
  line-height: 40px;
  vertical-align: middle;
  no-border: 1px solid red;
}
.form-editor form label.checkbox[data-value=checked] {
  background-image: url("../img/icons/check-box-checked.png");
}
.form-editor form label.checkbox[data-value=unchecked] {
  background-image: url("../img/icons/unchecked.png");
}
.form-editor form .xcontent label {
  /* label standard */
  display: block;
  width: 20em;
  clear: both;
  float: left;
  font-size: 1.2em;
  font-weight: bold;
  padding: 0.3em;
  text-align: left;
  /* label dentro de un item con contenido comprimido
     no se utilizan separadores li y por ello
     hay que dejar un poco mas de espacio en el label.
   */
  margin-top: 0em;
}
.form-editor form .xcontent label > b {
  /* Asterisco dentro del label para indicar campo requerido */
  color: orange;
  font-size: 1.4em;
  font-weight: bold;
}
.form-editor form label.no-indent {
  /* label sin indentacion despues del label, ocupa todo el ancho */
  float: none;
  width: 100%;
}
.form-editor form.no-indent label {
  /* label dentro de un formulario sin indentacion */
  float: none;
  width: 100%;
}
.form-editor form li,
.form-editor form > p,
.form-editor form > div > p {
  /* standard */
  padding: 1.2em 0;
}
.form-editor form fieldset > p {
  padding: 0.4em 0 0.4em 1em;
  margin-left: 30%;
}
.form-editor form li > p.hint {
  /* Hint dentro de un control */
  padding-top: 1em;
  padding-left: 1em;
  color: #666;
  margin-left: 30%;
}
.form-editor form li > p.hint.no-indent {
  margin-left: 0em;
}
.form-editor form li > p.error {
  color: red;
  font-weight: bold;
}
.form-editor form li .options {
  color: #000;
  line-height: 22px;
  font-size: 1.2em;
  vertical-align: top;
}
.form-editor form li .options > span {
  display: inline-block;
  margin-right: 2px;
  margin-bottom: 2px;
  padding: 4px 0.6em 4px 0.4em;
  background-color: #eee;
  vertical-align: top;
  color: #000;
}
.form-editor form li .options > span > input {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0.5em 0 0;
}
.form-editor form.dynamic {
  font-family: "Nunito Regular";
  font-size: 1em;
  --border:1px solid #888;
  --webkit-box-shadow: 2px 2px 1px #999;
  margin-left: 1.5em;
}
.form-editor form.dynamic .form-section {
  background-color: transparent;
}
.form-editor form.dynamic ul, .form-editor .content form.dynamic .form-section > .form-list, .content .form-editor form.dynamic .form-section > .form-list, .form-editor .content form.dynamic .form-section > .form-row, .content .form-editor form.dynamic .form-section > .form-row {
  margin-bottom: 0em;
}
.form-editor form.dynamic li {
  padding: 1em 1em;
  margin: 0;
}
.form-editor form.dynamic li a:hover {
  background-color: tomato;
}
.form-editor form.dynamic li.divider,
.form-editor form.dynamic li.handle {
  margin-top: 0em;
  padding: 1em;
  font-size: 10pt;
  font-weight: bold;
  background-color: #c6ffc9;
  color: #444;
  vertical-align: bottom;
  clip: inherit;
  line-height: 1.2em;
}
.form-editor form.dynamic li.divider button,
.form-editor form.dynamic li.handle button {
  padding: 0.4em 1em 0.4em 1em;
  float: right;
  margin: 0px;
  margin-top: -0.5em;
}
.form-editor form.dynamic li a label,
.form-editor form.dynamic li fieldset label {
  padding: 0;
  margin-top: 5pt;
  clear: both;
  float: left;
  width: 34%;
  white-space: normal;
  color: #333;
  font-size: 10pt;
  border-bottom: 1px solid #ddd;
}
.form-editor form.dynamic li fieldset {
  padding: 0;
}
.form-editor form.dynamic li a.wide label,
.form-editor form.dynamic li fieldset.wide label {
  float: none;
  display: block;
  width: 100%;
}
.form-editor form.dynamic li label b.required {
  font-size: 1.2em;
  color: orange;
}
.form-editor form.dynamic li p.hint {
  font-size: 0.9em;
  color: #666;
  font-weight: normal;
  padding: 0.5em 0 0 0;
}
.form-editor form.dynamic li p.value {
  display: block;
  min-height: 1.2em;
  margin: -4px 10px 0px 36%;
  padding: 0.5em;
  white-space: normal;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  border-bottom: 2px solid orange;
  border-radius: 0px;
  background-color: transparent;
  color: #333;
}
.form-editor form.dynamic li .wide p.value {
  display: block;
  margin: 0px 0% 0px -4px;
}
.form-editor form.dynamic li .wide img.nada {
  display: inline-block;
  float: none;
  margin: 4px 10px 0px 0%;
  width: 30%;
}
.form-editor form.dynamic p.value img {
  display: inline-block;
  width: 100%;
  border: 1px solid #ccc;
  margin-right: 1em;
}
.form-editor form.dynamic p.value img.icon {
  display: inline-block;
  width: 22px;
}
.form-editor form.dynamic li .wide p.value.area {
  -webkit-appearance: none;
  border: none;
  border-radius: 0px;
  background-color: transparent;
  background-image: url("../img/icons/renglon26px.png");
  background-position: top left;
  background-repeat: repeat;
  min-height: 52px;
  margin: auto;
  display: block;
  font-size: 1em;
  line-height: 26px;
  vertical-align: middle;
}
.form-editor form.dynamic li .wide p.value.gallery {
  -webkit-appearance: none;
  display: block;
  clear: both;
  margin-left: 0;
  font-size: 1em;
  line-height: 26px;
  vertical-align: middle;
}
.form-editor form.dynamic ul.list-block > li, .form-editor form.dynamic .content ul.list-block.content-grid > li, .form-editor .content form.dynamic .form-section > .list-block.form-list > li, .content .form-editor form.dynamic .form-section > .list-block.form-list > li, .form-editor .content form.dynamic .form-section > .list-block.form-row > li, .content .form-editor form.dynamic .form-section > .list-block.form-row > li {
  no-width: 100%;
  /* no tocar este ancho !!! */
}
.form-editor form.dynamic ul.list-block > li > table, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table {
  width: 100%;
  table-layout: auto;
  border-collapse: collapse;
  empty-cells: show;
  border-spacing: 0em;
  text-align: left;
}
.form-editor form.dynamic ul.list-block > li > table th, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th {
  font-size: 1.1em;
  font-weight: bold;
  text-align: left;
  border-bottom: 1px solid #aaa;
  margin-right: 4px;
  background-color: #eee;
  border-right: 4px solid #fff;
  padding: 0.5em;
}
.form-editor form.dynamic ul.list-block > li > table td, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td {
  text-align: left;
  border-bottom: 1px solid #ccc;
  vertical-align: top;
  padding-top: 0.3em;
  margin-right: 4px;
}
.form-editor form.dynamic ul.list-block > li > table td fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td fieldset {
  margin: 0;
  padding: 0 0 0.2em 0;
}
.form-editor form.dynamic ul.list-block > li > table td p.value, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td p.value, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td p.value, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td p.value, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td p.value {
  margin-left: 0;
  font-size: 1.3em;
}
.form-editor form.dynamic ul.list-block > li > table th.TextField, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.TextField, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.TextField, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.TextField, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.TextField {
  text-align: left;
}
.form-editor form.dynamic ul.list-block > li > table th.PhotoField, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.PhotoField, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.PhotoField, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.PhotoField, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.PhotoField,
.form-editor form.dynamic ul.list-block > li > table th.NumberField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.NumberField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.NumberField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.NumberField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.NumberField,
.form-editor form.dynamic ul.list-block > li > table th.DateField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.DateField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.DateField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.DateField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.DateField,
.form-editor form.dynamic ul.list-block > li > table th.TimeField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.TimeField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.TimeField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.TimeField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.TimeField,
.form-editor form.dynamic ul.list-block > li > table th.CheckField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.CheckField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.CheckField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.CheckField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.CheckField,
.form-editor form.dynamic ul.list-block > li > table th.OptionField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.OptionField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.OptionField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.OptionField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.OptionField {
  text-align: center;
  width: 15%;
}
.form-editor form.dynamic ul.list-block > li > table th.buttons, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table th.buttons, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table th.buttons, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table th.buttons, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table th.buttons {
  text-align: center;
  --background: none;
  --border:none;
  width: 5%;
}
.form-editor form.dynamic ul.list-block > li > table td.TextField, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.TextField, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.TextField, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.TextField, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.TextField {
  text-align: left;
  width: 25%;
}
.form-editor form.dynamic ul.list-block > li > table td.PhotoField, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.PhotoField, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.PhotoField, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.PhotoField, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.PhotoField,
.form-editor form.dynamic ul.list-block > li > table td.NumberField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.NumberField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.NumberField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.NumberField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.NumberField,
.form-editor form.dynamic ul.list-block > li > table td.DateField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.DateField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.DateField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.DateField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.DateField,
.form-editor form.dynamic ul.list-block > li > table td.TimeField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.TimeField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.TimeField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.TimeField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.TimeField,
.form-editor form.dynamic ul.list-block > li > table td.CheckField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.CheckField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.CheckField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.CheckField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.CheckField,
.form-editor form.dynamic ul.list-block > li > table td.OptionField,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.OptionField,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.OptionField,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.OptionField,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.OptionField {
  text-align: center;
  width: 15%;
  padding-left: 0.4em;
  padding-right: 0.4em;
}
.form-editor form.dynamic ul.list-block > li > table td.buttons, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > table td.buttons, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > table td.buttons, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > table td.buttons, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > table td.buttons {
  text-align: center;
  background: none;
  --border:none;
  width: 5%;
  padding-bottom: 0.3em;
}
.form-editor form.dynamic ul.list-block > li > ul.fields, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row {
  text-align: left;
  /* los campos estan alineados a derecha,
                       excepto el primero  */
  min-height: 4em;
  /* como el primer campo es flotante,
    debemos asegurar una altura minima */
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li {
  display: inline-block;
  border: none;
  padding: 0;
  margin: 0;
  vertical-align: top;
  margin-right: 12px;
  margin-bottom: 24px;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li[type="TextField notes"], .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li[type="TextField notes"], .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li[type="TextField notes"], .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li[type="TextField notes"], .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li[type="TextField notes"], .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li[type="TextField notes"], .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li[type="TextField notes"], .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li[type="TextField notes"], .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li[type="TextField notes"] {
  /* el caso particular de una Nota DEBE tomar tood el ancho */
  width: 100%;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li[type="TextField notes"] p.value.area {
  border-bottom: 2px solid #ffA500;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset,
.form-editor form.dynamic ul.list-block > li > ul.fields > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a {
  display: block;
  margin: 0em;
  padding: 0em;
  border: 0px dotted red;
  text-align: center;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset label, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset label, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset label, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset label, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset label, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset label, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset label, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset label, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset label,
.form-editor form.dynamic ul.list-block > li > ul.fields > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a label,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a label,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a label,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a label,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a label,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a label,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a label,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a label,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a label {
  display: block;
  margin: 0em;
  padding: 0.1em 0.2em;
  clear: both;
  float: none;
  width: 100%;
  font-size: 0.8em;
  font-weight: bold;
  border: none;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset p.value, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset p.value, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset p.value, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset p.value, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset p.value, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset p.value, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset p.value, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset p.value, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset p.value,
.form-editor form.dynamic ul.list-block > li > ul.fields > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a p.value,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a p.value,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a p.value,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a p.value,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a p.value,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a p.value,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a p.value,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a p.value,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a p.value {
  display: block;
  margin: 0em;
  font-weight: normal;
}
.form-editor form.dynamic ul.list-block > li > ul.fields > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > fieldset span.small, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset span.small, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > fieldset span.small, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > fieldset span.small, .form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset span.small, .content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > fieldset span.small, .form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > fieldset span.small, .form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset span.small, .content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > fieldset span.small,
.form-editor form.dynamic ul.list-block > li > ul.fields > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li > ul.fields > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li > ul.fields > li > a span.small,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a span.small,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-list > li > a span.small,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-list > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-list > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-list > li > a span.small,
.form-editor .content form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a span.small,
.content .form-editor form.dynamic ul.list-block > li.form-section > .fields.form-row > li > a span.small,
.form-editor form.dynamic .content form ul.list-block.content-grid > li.form-section > .fields.form-row > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-list > li.form-section > .fields.form-row > li > a span.small,
.form-editor .content form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a span.small,
.content .form-editor form.dynamic .form-section > .list-block.form-row > li.form-section > .fields.form-row > li > a span.small {
  display: block;
  margin: 4px;
  font-weight: normal;
  font-size: 10px;
}
.form-editor form.dynamic a.check-ctrl p.value[data-value=true] {
  border: none;
  background: url("img/mdpi/light/check-box-checked.png") center left no-repeat;
}
.form-editor form.dynamic a.check-ctrl p.value[data-value=false] {
  border: none;
  background: url("img/mdpi/light/unchecked.png") center left no-repeat;
}
.form-editor form.dynamic .CheckField.control p.value img {
  width: 24px;
}
.form-editor form.dynamic .options-ctrl p.value {
  border: none;
  background: none;
  padding: 0;
}
.form-editor form.dynamic .options-ctrl p.value a {
  display: inline-block;
  font-size: 0.9em;
  font-style: normal;
  text-decoration: none;
  border: 1px solid #ddd;
  border-radius: 0.4em;
  margin-right: 0;
  padding: 0.5em;
  background-color: #fff;
  color: #444;
}
.form-editor form.dynamic .options-ctrl p.value a.selected {
  font-size: 1.1em;
  font-weight: bold;
  border: 1px solid orange;
  -webkit-box-shadow: 4px 4px 4px #ddd;
}
.form-editor form.dynamic li.list-item-ctrl {
  display: block;
  clear: both;
  width: inherit;
}
.form-editor form.dynamic li.list-item-ctrl > a:first-child {
  display: inline-block;
  width: 75%;
  text-align: left;
}
.form-editor form.dynamic li.list-item-ctrl > a:first-child p.value {
  display: block;
  border: none;
  margin: 0;
  color: #000;
}
.form-editor form.dynamic li.list-item-ctrl > a:last-child {
  display: inline-block;
  width: 20%;
  --text-align: right;
  float: right;
}
.form-editor form.dynamic li.list-item-ctrl > a:last-child p.value {
  display: block;
  margin: 0;
}
.form-editor form.dynamic li.list-item-ctrl label {
  display: none;
  float: none;
}
.form-editor form.control {
  font-size: 1em;
}
.form-editor form.control textarea {
  -webkit-appearance: none;
  border: none;
  border-radius: 0px;
  background-color: transparent;
  background-image: url("../img/renglon32.png");
  background-position: top left;
  background-repeat: repeat;
  height: 104px;
  margin: auto;
  display: block;
  font-size: 28px;
  line-height: 32px;
}
.form-editor form.control textarea:focus {
  -webkit-appearance: none;
  border: none;
  border-radius: 0px;
  background-color: transparent;
  background-image: url("../img/renglon32.png");
  background-position: top left;
  background-repeat: repeat;
  height: 104px;
  margin: auto;
  display: block;
  font-size: 28px;
  line-height: 32px;
}
.form-editor form.control input {
  /* width:90%; */
  margin: auto;
  display: block;
  font-size: 26pt;
}
.form-editor form.control ul[name=input], .form-editor .content form.control .form-section > [name=input].form-list, .content .form-editor form.control .form-section > [name=input].form-list, .form-editor .content form.control .form-section > [name=input].form-row, .content .form-editor form.control .form-section > [name=input].form-row {
  overflow: auto;
  max-height: 30em;
}
.form-editor form.control li.checked {
  background-image: url("img/mdpi/light/check-box-checked.png");
  background-position: center right;
  background-repeat: no-repeat;
  margin: 0 1em;
  padding-right: 32px;
  padding-left: 0px;
  font-size: 1.3em;
}
.form-editor form.control li.unchecked {
  background-image: url("img/mdpi/light/unchecked.png");
  background-position: center right;
  background-repeat: no-repeat;
  margin: 0 1em;
  padding-right: 32px;
  padding-left: 0px;
  font-size: 1.3em;
}
.form-editor form.control li.photo-list img {
  display: inline-block;
  width: 20%;
  margin-right: 1em;
}
.form-editor table.calendar {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0px;
  empty-cells: show;
  width: 420px;
  margin: 0 auto;
  font-size: 1.2em;
}
.form-editor table.calendar td {
  max-width: 60px;
  text-align: center;
  padding: 0px;
  border: 1px solid #ccc;
  background-color: #fdfdfd;
}
.form-editor table.calendar td input {
  width: 60px;
  height: 60px;
  border: none;
  background-color: transparent;
  border-radius: 0;
}
.form-editor table.calendar tr.header td {
  height: 60px;
  background: #888888;
  /* Old browsers */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #888));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #555 0%, #888 100%);
  /* Chrome10+,Safari5.1+ */
  color: #fff;
  font-weight: bold;
}
.form-editor table.calendar tr.header td input {
  background-color: transparent;
  color: #fff;
}
.form-editor table.calendar tr.day-names td {
  text-align: center;
  padding: 0.4em 0;
  font-weight: bold;
  background-color: #666;
  color: #fff;
}
.form-editor table.calendar tr.days td {
  height: 60px;
  border: 1px solid #ccc;
  text-align: center;
  padding: 0px;
}
.form-editor table.calendar tr.days td input.selected {
  background-color: orange;
  font-size: 1.2em;
}
.form-editor .numeric-keyb table {
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 6px;
  empty-cells: show;
  margin: 0 auto;
  font-size: 1.4em;
  text-align: center;
  border-radius: 1em;
}
.form-editor .numeric-keyb table td {
  padding: 0;
}
.form-editor .numeric-keyb table td button {
  padding: 1.1em 1.2em;
  width: 100%;
  min-height: 60px;
  text-align: center;
  border-radius: 6px;
  color: #fff;
  background: #888888;
  /* Old browsers */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #555), color-stop(100%, #888));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #555 0%, #888 100%);
  /* Chrome10+,Safari5.1+ */
  border: 1px solid #bbb;
}
.form-editor .numeric-keyb table td button.half {
  width: 48%;
  text-align: center;
}
.form-editor p.value img.photo {
  display: inline-block;
  width: 20%;
  border: 1px solid red;
}

/*
* POPUPS USADOS POR EDITOR
*/
#editables-pop {
  width: 280pt;
  max-width: 280pt;
  /* debemos limitar el ancho */
  width: 480px;
  max-width: 480px;
}
#editables-pop div {
  /* background-color: #888889; */
  color: #ab3a3a;
  position: absolute;
  bottom: 0px;
  top: 0px;
  left: 0;
  right: 0;
}
#editables-pop form fieldset.xcontent {
  overflow-y: auto;
  position: absolute;
  top: 69px;
  bottom: 66px;
  left: 0;
  right: 0;
  padding: 20px 10px;
  margin: 0;
  font-size: 12px;
}
#editables-pop form fieldset.xcontent textarea {
  padding: 4px;
  font-size: 16px;
}
#editables-pop form fieldset.xfooter {
  overflow: overlay;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #edede5;
  display: block;
  padding: 10px 3em;
  margin: 0;
  text-align: right;
}
#editables-pop form fieldset.xfooter button > i {
  font-size: 26px;
  color: #ab3a3a;
}

#upload-templates-pop h3 {
  font-size: 1.35em;
  margin-left: 0.5em;
  margin-bottom: 0.5em;
  padding: 0.6em;
  color: #fff;
  background-color: #666660;
  border-radius: 0.4em;
}

#vars-list-pop #vars-list li {
  display: inline-block;
  border: 1px solid #ddd;
  border-radius: 6px;
  background-color: #fff;
  padding: 0.4em;
  margin: 2px;
}

.vars-list .options {
  /* lista de variables en Dialog para editar un Field*/
  font-weight: bold;
  font-size: 1.2em;
  background-color: #f3f3db;
  padding: 3px 3px 6px 3px;
  display: block;
  border-bottom: 1px solid #aaa;
}
.vars-list .option {
  display: inline-block;
  border: 1px solid #ddd;
  border-radius: 6px;
  background-color: #fff;
  padding: 2px 5px;
  margin: 2px;
  line-height: 1.4em;
  text-decoration: none;
  font-weight: normal;
}
.vars-list .option button.option-remove-btn {
  padding: 0;
  margin: 0;
  border: none;
}
.vars-list .option button.option-remove-btn i {
  font-size: 18px;
  color: #cca;
}
.vars-list .option.wide {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 2px 0px 2px 4px;
}
.vars-list .option.wide .option-content {
  display: block;
  font-size: 0.95em;
  line-height: 1.4em;
}
.vars-list .option.wide .option-content > .descr {
  display: inline !important;
}
.vars-list .option.wide .option-remove-btn {
  display: inline-block;
  width: 24px;
  height: 16px;
  padding: 0 4px;
  margin: 0;
  border-left: 1px solid #DDD;
  text-align: center;
  line-height: 16px;
  cursor: pointer;
}
.vars-list .option.wide .option-remove-btn i {
  font-size: 16px;
  color: red;
}

/*
*   POPUP para contener un dialogo/miniformulario
*   para cambiar las props de un cierto item/columna/campo
*   aparece ABAJO del item seleccionado para editar
*/
.lower-pop-dialog {
  display: none;
  position: absolute;
  top: 0;
  background-color: #fff;
  padding: 0;
  z-index: 2;
  box-shadow: 0px 0px 20px #2f2f2f;
  font-size: 8pt;
}
.lower-pop-dialog h2, .lower-pop-dialog h3, .lower-pop-dialog h4, .lower-pop-dialog h5, .lower-pop-dialog h6, .lower-pop-dialog p, .lower-pop-dialog span, .lower-pop-dialog div, .lower-pop-dialog form {
  font-family: Arial, Helvetica, sans-serif;
}
.lower-pop-dialog hr {
  margin-left: -10px;
  margin-right: -10px;
  margin-bottom: 10px;
  margin-top: 10px;
  border-color: none;
  display: block;
  clear: both;
}
.lower-pop-dialog .pointer {
  display: inline-block;
  position: absolute;
}
.lower-pop-dialog .pointer i {
  font-size: 34px;
  color: inherit;
}
.lower-pop-dialog img {
  padding: 0px;
  margin: 0px;
  margin-left: 10px;
  vertical-align: bottom;
  margin-top: -7px;
  display: block;
  position: absolute;
}
.lower-pop-dialog div {
  margin: 0;
  border: 1px solid #9C9C9C;
  padding: 10px;
  text-align: left;
  bottom: 0px;
  top: 0px;
}
.lower-pop-dialog div h2 {
  margin: 0em 0 0.7em 0;
  padding: 0.5em 0;
  border-bottom: 1px solid #ccc;
  font-size: 1.2em;
}
.lower-pop-dialog div h3.title {
  position: relative;
  padding: 0 5px 0px 5px;
  margin-bottom: 0px;
  border-radius: 0px !important;
  background-color: #d9dac5;
  font-size: 16px;
  font-weight: normal;
  color: #eeeeeb;
  padding: 20px;
  margin-top: -11px;
  margin-left: -10px;
  margin-right: -11px;
  margin-bottom: 20px;
}
.lower-pop-dialog div h3.title span.type-descr {
  color: #fff;
  font-size: 16px;
  max-width: 9em;
  overflow: hidden;
  display: inline-block;
}
.lower-pop-dialog div h3.title input[name=alias] {
  font-weight: normal;
  font-size: 1.1rem;
  border: none;
  background-color: #f8f8ed;
  text-align: right;
  width: 14em;
  float: right;
  color: #23232d;
  padding: 6px 6px;
}
.lower-pop-dialog div h3.title input[name=alias] > a {
  font-weight: bold;
}
.lower-pop-dialog div span > p {
  font-size: 1em;
  padding: 0em 1em;
}
.lower-pop-dialog div span > p > a {
  font-size: 1.4em;
  color: blue;
}
.lower-pop-dialog form label {
  /* label standard */
  display: block;
  width: 80pt;
  clear: both;
  float: left;
  font-size: 1.2em;
  font-weight: bold;
  padding: 0.3em;
  text-align: left;
  /* label dentro de un item con contenido comprimido
     no se utilizan separadores li y por ello
     hay que dejar un poco mas de espacio en el label.
   */
  margin-top: 0em;
}
.lower-pop-dialog form label > b {
  /* Asterisco dentro del label para indicar campo requerido */
  color: orange;
  font-size: 1.4em;
  font-weight: bold;
}
.lower-pop-dialog form label.no-indent {
  width: 90%;
}
.lower-pop-dialog form .more, .lower-pop-dialog form .more-info {
  font-size: 0.9rem;
}
.lower-pop-dialog form button {
  padding: 4px 12px;
  border-radius: 4px;
  border: none;
  background-color: inherit;
}
.lower-pop-dialog form button > i {
  font-size: 26px;
  color: #ab3a3a;
}
.lower-pop-dialog form button.rounded {
  padding: 0 9px 0 8px;
  border-radius: 22px;
  border: none;
  margin: 0 6px;
  vertical-align: middle;
}
.lower-pop-dialog form button.rounded > i {
  font-size: 24px;
}
.lower-pop-dialog form button.btn-add-constant {
  background-color: #ccd;
  cursor: pointer;
}
.lower-pop-dialog form h4 {
  font-size: 1rem;
  margin: 0;
  font-weight: bold;
  clear: both;
  padding: 0.5rem 0.2rem;
  color: #514343;
}
.lower-pop-dialog form p {
  padding: 0.5em 1em;
  margin-left: 80pt;
  font-size: 1em;
}
.lower-pop-dialog form p.indented {
  clear: both;
  float: none;
  display: inline-block;
}
.lower-pop-dialog form p.no-margin {
  margin: 0 !important;
}
.lower-pop-dialog form p b.aside {
  color: cyan;
  border-bottom: 1px dotted cyan;
}
.lower-pop-dialog form p span {
  display: inline-block;
  margin-right: 1em;
  margin-bottom: 4px;
  vertical-align: middle;
  line-height: 1em;
}
.lower-pop-dialog form p span input[type=checkbox] {
  vertical-align: sub;
}
.lower-pop-dialog form p.col2var {
  margin-left: -20px;
}
.lower-pop-dialog form p.col2var button i {
  font-size: 22px;
}
.lower-pop-dialog form .wide {
  width: 96%;
  max-width: 96% !important;
  display: block;
  margin: 0.2em auto;
  float: none;
  clear: both;
}
.lower-pop-dialog form .options.wide {
  margin-bottom: 0;
  padding: 0;
  overflow-y: auto;
}
.lower-pop-dialog form .options.wide p {
  padding: 2px;
  margin-left: 0;
}
.lower-pop-dialog form input, .lower-pop-dialog form select {
  padding: 0.5em;
  font-size: 1.2em;
  max-width: 144pt;
  background: none;
}
.lower-pop-dialog form select[name=field], .lower-pop-dialog form select[name=column] {
  max-width: 120pt;
}

/* modifiers de este componente */
.lower-pop-dialog.popup {
  display: block;
}

/* muestra el dialogo */
.lower-pop-dialog.right img {
  margin-right: 10px;
}

/* alineado a la derecha */
.lower-pop-dialog.center-pointer {
  text-align: center;
}

/* puntero centrado */
.lower-pop-dialog span.moving-pointer {
  display: block;
  height: 10px;
  width: 20px;
  background-image: url("../img/extras/pointer.png");
  background-position: bottom center;
  background-repeat: no-repeat;
  background-color: transparent;
  border: none;
  position: absolute;
  top: -10px;
  right: 10px;
}

/* DEFINIR */
/* GALERIAS DE BOTONES PARA DISEÑAR EL FORMULARIO */
#record-def-page .lower-pop-dialog button {
  border: 1px solid #ccc;
  padding: 1em;
  background: #dddddd;
  /* Old browsers */
  background: -moz-linear-gradient(top, #dddddd 0%, #f1f1f1 27%, #f1f1f1 69%, #dddddd 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(27%, #f1f1f1), color-stop(69%, #f1f1f1), color-stop(100%, #dddddd));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #dddddd 0%, #f1f1f1 27%, #f1f1f1 69%, #dddddd 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #dddddd 0%, #f1f1f1 27%, #f1f1f1 69%, #dddddd 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #dddddd 0%, #f1f1f1 27%, #f1f1f1 69%, #dddddd 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #dddddd 0%, #f1f1f1 27%, #f1f1f1 69%, #dddddd 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#dddddd", endColorstr="#dddddd",GradientType=0 );
  /* IE6-9 */
}

#record-def-page .lower-pop-dialog button:before {
  content: url("../img/icons/trash.png");
}

#record-def-page .lower-pop-dialog button img {
  display: block;
}

#record-def-page .lower-pop-dialog button p {
  font-size: 0.9em;
  font-weight: normal;
}

#record-def-page .container {
  margin-top: 0;
}

/*
*   El panel para insertar componentes en el formulario
*/
#form-editor-device .subpane,
#form-editor-tools .subpane,
.form-editor-tools .subpane,
.device-emulator-contexts .subpane {
  padding-top: 0.6em;
}
#form-editor-device .subpane p,
#form-editor-tools .subpane p,
.form-editor-tools .subpane p,
.device-emulator-contexts .subpane p {
  border-bottom: none;
}
#form-editor-device .subpane p b,
#form-editor-tools .subpane p b,
.form-editor-tools .subpane p b,
.device-emulator-contexts .subpane p b {
  background-color: #b16e6e;
  color: #fff;
  padding: 4px 12px;
}
#form-editor-device h5,
#form-editor-tools h5,
.form-editor-tools h5,
.device-emulator-contexts h5 {
  font-size: 11pt;
  color: #555;
  padding: 0;
  font-weight: bold;
  margin-bottom: 4px;
}
#form-editor-device h5 a,
#form-editor-tools h5 a,
.form-editor-tools h5 a,
.device-emulator-contexts h5 a {
  color: inherit;
}
#form-editor-device h5 a:hover,
#form-editor-tools h5 a:hover,
.form-editor-tools h5 a:hover,
.device-emulator-contexts h5 a:hover {
  background-color: #888889;
  color: #fff;
  padding: 5px 1em;
}
#form-editor-device p,
#form-editor-tools p,
.form-editor-tools p,
.device-emulator-contexts p {
  font-size: 0.9rem;
  color: #85858b;
  line-height: 1.44rem;
  margin-bottom: 1em;
}
#form-editor-device button,
#form-editor-tools button,
.form-editor-tools button,
.device-emulator-contexts button {
  margin-bottom: 4px;
  min-height: 55px;
  /* height: 55px; */
  width: 72px;
  padding: 8px;
  line-height: 15px;
  border: 1px dashed #454545;
  border-radius: 4px;
  background: none;
  font-size: 11px;
  font-family: Helvetica, sans-serif;
}
#form-editor-device button p,
#form-editor-tools button p,
.form-editor-tools button p,
.device-emulator-contexts button p {
  display: none;
}
#form-editor-device button i,
#form-editor-tools button i,
.form-editor-tools button i,
.device-emulator-contexts button i {
  font-size: 8px;
  font-weight: normal;
  font-style: normal;
}
#form-editor-device button img,
#form-editor-tools button img,
.form-editor-tools button img,
.device-emulator-contexts button img {
  margin-bottom: 10px;
}
#form-editor-device #form-divisions-pane button,
#form-editor-tools #form-divisions-pane button,
.form-editor-tools #form-divisions-pane button,
.device-emulator-contexts #form-divisions-pane button {
  width: 70pt;
}
#form-editor-device button[ref="#section-block-dlg"]:before,
#form-editor-tools button[ref="#section-block-dlg"]:before,
.form-editor-tools button[ref="#section-block-dlg"]:before,
.device-emulator-contexts button[ref="#section-block-dlg"]:before {
  content: url("../img/icons/div-section.png");
}
#form-editor-device button[ref="#paragraph-block-dlg"]:before,
#form-editor-tools button[ref="#paragraph-block-dlg"]:before,
.form-editor-tools button[ref="#paragraph-block-dlg"]:before,
.device-emulator-contexts button[ref="#paragraph-block-dlg"]:before {
  content: url("../img/icons/div-paragraph.png");
}
#form-editor-device button[ref="#list-block-dlg"]:before,
#form-editor-tools button[ref="#list-block-dlg"]:before,
.form-editor-tools button[ref="#list-block-dlg"]:before,
.device-emulator-contexts button[ref="#list-block-dlg"]:before {
  content: url("../img/icons/div-table.png");
}
#form-editor-device button[ref="#table-block-dlg"]:before,
#form-editor-tools button[ref="#table-block-dlg"]:before,
.form-editor-tools button[ref="#table-block-dlg"]:before,
.device-emulator-contexts button[ref="#table-block-dlg"]:before {
  content: url("../img/icons/div-list.png");
}
#form-editor-device button[ref="#grid-block-dlg"]:before,
#form-editor-tools button[ref="#grid-block-dlg"]:before,
.form-editor-tools button[ref="#grid-block-dlg"]:before,
.device-emulator-contexts button[ref="#grid-block-dlg"]:before {
  content: url("../img/icons/div-grid.png");
}
#form-editor-device button[ref="#text-input"]:before,
#form-editor-tools button[ref="#text-input"]:before,
.form-editor-tools button[ref="#text-input"]:before,
.device-emulator-contexts button[ref="#text-input"]:before {
  content: url("../img/icons/text-input.png");
}
#form-editor-device button[ref="#number-input"]:before,
#form-editor-tools button[ref="#number-input"]:before,
.form-editor-tools button[ref="#number-input"]:before,
.device-emulator-contexts button[ref="#number-input"]:before {
  content: url("../img/icons/number-input.png");
}
#form-editor-device button[ref="#date-input"]:before,
#form-editor-tools button[ref="#date-input"]:before,
.form-editor-tools button[ref="#date-input"]:before,
.device-emulator-contexts button[ref="#date-input"]:before {
  content: url("../img/icons/date-input.png");
}
#form-editor-device button[ref="#time-input"]:before,
#form-editor-tools button[ref="#time-input"]:before,
.form-editor-tools button[ref="#time-input"]:before,
.device-emulator-contexts button[ref="#time-input"]:before {
  content: url("../img/icons/time-input.png");
}
#form-editor-device button[ref="#check-input"]:before,
#form-editor-tools button[ref="#check-input"]:before,
.form-editor-tools button[ref="#check-input"]:before,
.device-emulator-contexts button[ref="#check-input"]:before {
  content: url("../img/icons/check-input.png");
}
#form-editor-device button[ref="#option-input"]:before,
#form-editor-tools button[ref="#option-input"]:before,
.form-editor-tools button[ref="#option-input"]:before,
.device-emulator-contexts button[ref="#option-input"]:before {
  content: url("../img/icons/option-input.png");
}
#form-editor-device button[ref="#object-selector"]:before,
#form-editor-tools button[ref="#object-selector"]:before,
.form-editor-tools button[ref="#object-selector"]:before,
.device-emulator-contexts button[ref="#object-selector"]:before {
  content: url("../img/icons/object-selector.png");
}
#form-editor-device button[ref="#photo-capture"]:before,
#form-editor-tools button[ref="#photo-capture"]:before,
.form-editor-tools button[ref="#photo-capture"]:before,
.device-emulator-contexts button[ref="#photo-capture"]:before {
  content: url("../img/icons/camera-capture.png");
}
#form-editor-device button[ref="#qrcode-capture"]:before,
#form-editor-tools button[ref="#qrcode-capture"]:before,
.form-editor-tools button[ref="#qrcode-capture"]:before,
.device-emulator-contexts button[ref="#qrcode-capture"]:before {
  content: url("../img/icons/qr-capture.png");
}
#form-editor-device button[ref="#gps-capture"]:before,
#form-editor-tools button[ref="#gps-capture"]:before,
.form-editor-tools button[ref="#gps-capture"]:before,
.device-emulator-contexts button[ref="#gps-capture"]:before {
  content: url("../img/icons/gps-capture.png");
}
#form-editor-device button[ref="#attachs-capture"]:before,
#form-editor-tools button[ref="#attachs-capture"]:before,
.form-editor-tools button[ref="#attachs-capture"]:before,
.device-emulator-contexts button[ref="#attachs-capture"]:before {
  content: url("../img/icons/attachment.png");
}
#form-editor-device button[ref="#graph-view"]:before,
#form-editor-tools button[ref="#graph-view"]:before,
.form-editor-tools button[ref="#graph-view"]:before,
.device-emulator-contexts button[ref="#graph-view"]:before {
  content: url("../img/icons/line-graph.png");
}
#form-editor-device button[ref="#signature-capture"]:before,
#form-editor-tools button[ref="#signature-capture"]:before,
.form-editor-tools button[ref="#signature-capture"]:before,
.device-emulator-contexts button[ref="#signature-capture"]:before {
  content: url("../img/icons/5-content-edit.png");
}
#form-editor-device button[ref="#signature-capture"]:before,
#form-editor-tools button[ref="#signature-capture"]:before,
.form-editor-tools button[ref="#signature-capture"]:before,
.device-emulator-contexts button[ref="#signature-capture"]:before {
  content: url("../img/icons/link.png");
}
#form-editor-device button[ref="#calculation-logic"]:before,
#form-editor-tools button[ref="#calculation-logic"]:before,
.form-editor-tools button[ref="#calculation-logic"]:before,
.device-emulator-contexts button[ref="#calculation-logic"]:before {
  content: url("../img/icons/bigcalculator.png");
}
#form-editor-device button[ref="#concatenation-logic"]:before,
#form-editor-tools button[ref="#concatenation-logic"]:before,
.form-editor-tools button[ref="#concatenation-logic"]:before,
.device-emulator-contexts button[ref="#concatenation-logic"]:before {
  content: url("../img/icons/concatenation.png");
}
#form-editor-device button[ref="#conditional-logic"]:before,
#form-editor-tools button[ref="#conditional-logic"]:before,
.form-editor-tools button[ref="#conditional-logic"]:before,
.device-emulator-contexts button[ref="#conditional-logic"]:before {
  content: url("../img/icons/wired.png");
}
#form-editor-device button[ref="#conditional-logic-sections"]:before,
#form-editor-tools button[ref="#conditional-logic-sections"]:before,
.form-editor-tools button[ref="#conditional-logic-sections"]:before,
.device-emulator-contexts button[ref="#conditional-logic-sections"]:before {
  content: url("../img/icons/wired.png");
}
#form-editor-device button[ref="#conditional-logic-fields"]:before,
#form-editor-tools button[ref="#conditional-logic-fields"]:before,
.form-editor-tools button[ref="#conditional-logic-fields"]:before,
.device-emulator-contexts button[ref="#conditional-logic-fields"]:before {
  content: url("../img/icons/wired.png");
}
#form-editor-device button[ref="#conditional-logic-rows"]:before,
#form-editor-tools button[ref="#conditional-logic-rows"]:before,
.form-editor-tools button[ref="#conditional-logic-rows"]:before,
.device-emulator-contexts button[ref="#conditional-logic-rows"]:before {
  content: url("../img/icons/wired.png");
}
#form-editor-device button[ref="#conditional-buttons"]:before,
#form-editor-tools button[ref="#conditional-buttons"]:before,
.form-editor-tools button[ref="#conditional-buttons"]:before,
.device-emulator-contexts button[ref="#conditional-buttons"]:before {
  content: url("../img/icons/play.png");
}
#form-editor-device button[ref="#local-stock-plugin"]:before,
#form-editor-tools button[ref="#local-stock-plugin"]:before,
.form-editor-tools button[ref="#local-stock-plugin"]:before,
.device-emulator-contexts button[ref="#local-stock-plugin"]:before {
  content: url("../img/icons/any-plugin.png");
}
#form-editor-device button[ref="#local-ticket-plugin"]:before,
#form-editor-tools button[ref="#local-ticket-plugin"]:before,
.form-editor-tools button[ref="#local-ticket-plugin"]:before,
.device-emulator-contexts button[ref="#local-ticket-plugin"]:before {
  content: url("../img/icons/print.png");
}
#form-editor-device button[ref="#list-columns-copy"]:before,
#form-editor-tools button[ref="#list-columns-copy"]:before,
.form-editor-tools button[ref="#list-columns-copy"]:before,
.device-emulator-contexts button[ref="#list-columns-copy"]:before {
  content: url("../img/icons/copy_page.png");
}
#form-editor-device button[ref="#email-alert-plugin"]:before,
#form-editor-tools button[ref="#email-alert-plugin"]:before,
.form-editor-tools button[ref="#email-alert-plugin"]:before,
.device-emulator-contexts button[ref="#email-alert-plugin"]:before {
  content: url("../img/icons/alert-email.png");
}
#form-editor-device button[ref="#remote-call-plugin"]:before,
#form-editor-tools button[ref="#remote-call-plugin"]:before,
.form-editor-tools button[ref="#remote-call-plugin"]:before,
.device-emulator-contexts button[ref="#remote-call-plugin"]:before {
  content: url("../img/icons/remote-call.png");
}
#form-editor-device button[ref="#pdf-fusion-plugin"]:before,
#form-editor-tools button[ref="#pdf-fusion-plugin"]:before,
.form-editor-tools button[ref="#pdf-fusion-plugin"]:before,
.device-emulator-contexts button[ref="#pdf-fusion-plugin"]:before {
  content: url("../img/icons/pdf-fusion.png");
}
#form-editor-device button[ref="#local-updatelist-plugin"]:before,
#form-editor-tools button[ref="#local-updatelist-plugin"]:before,
.form-editor-tools button[ref="#local-updatelist-plugin"]:before,
.device-emulator-contexts button[ref="#local-updatelist-plugin"]:before {
  content: url("../img/icons/stockage.png");
}
#form-editor-device button[ref="#device-phone-v"]:before,
#form-editor-tools button[ref="#device-phone-v"]:before,
.form-editor-tools button[ref="#device-phone-v"]:before,
.device-emulator-contexts button[ref="#device-phone-v"]:before {
  content: url("../img/icons/12-hardware-phone.png");
}
#form-editor-device button[ref="#device-tablet7-v"]:before,
#form-editor-tools button[ref="#device-tablet7-v"]:before,
.form-editor-tools button[ref="#device-tablet7-v"]:before,
.device-emulator-contexts button[ref="#device-tablet7-v"]:before {
  content: url("../img/icons/12-hardware-phone.png");
}
#form-editor-device button[ref="#device-tablet7-h"]:before,
#form-editor-tools button[ref="#device-tablet7-h"]:before,
.form-editor-tools button[ref="#device-tablet7-h"]:before,
.device-emulator-contexts button[ref="#device-tablet7-h"]:before {
  content: url("../img/icons/12-hardware-phone.png");
}
#form-editor-device button[ref="#device-tablet10-v"]:before,
#form-editor-tools button[ref="#device-tablet10-v"]:before,
.form-editor-tools button[ref="#device-tablet10-v"]:before,
.device-emulator-contexts button[ref="#device-tablet10-v"]:before {
  content: url("../img/icons/12-hardware-phone.png");
}
#form-editor-device button[ref="#device-tablet10-h"]:before,
#form-editor-tools button[ref="#device-tablet10-h"]:before,
.form-editor-tools button[ref="#device-tablet10-h"]:before,
.device-emulator-contexts button[ref="#device-tablet10-h"]:before {
  content: url("../img/icons/12-hardware-phone.png");
}

#editables-pop div .form-component-editor {
  /* The Editor for all Form Components (Field, Plugins, etc ...) */
  background-color: red;
}
#editables-pop div .form-component-div {
  /* A Div inside a form-component-editor */
  position: relative;
  border: none;
  margin: 0;
  padding: 0;
}
#editables-pop div .form-component-div p.hint {
  padding-left: 0;
  margin: 0.2em 0 0.6em 0;
  color: #99a;
}
#editables-pop div .form-component-div p.col2var {
  padding: 0px 1em;
  margin-left: -16px;
}
#editables-pop div .form-component-div p.col2var select {
  font-size: 1em;
}
#editables-pop div .form-component-div .AddOptionBtn {
  border: 1px solid #779;
  width: 32px;
  height: 32px;
  padding: 0;
  line-height: 29px;
}
#editables-pop div .form-component-div .AddOptionBtn i {
  color: #779;
}
#editables-pop div .form-component-div .RemoveOptionBtn {
  border: 1px solid #779;
  width: 32px;
  height: 32px;
  padding: 0;
  line-height: 29px;
}
#editables-pop div .form-component-div .RemoveOptionBtn i {
  color: #779;
}

/*
*	Common elements
*/
body {
  padding: 0;
  margin: 0;
  background-color: #fff;
}

.foot {
  padding: 10pt;
  text-align: center;
}
.foot > p {
  color: white;
}

/*
*	Home page grid tiles positioning
*	for different break points
*/
.tiles-grid {
  top: 0;
  bottom: 40pt;
}

#home #datagrip {
  left: 0%;
  top: 0pt;
  width: 40%;
  height: 172pt;
  background-color: #fff;
}
#home #new {
  left: 40%;
  top: 0pt;
  width: 20%;
  height: 172pt;
  background-color: #059c5e;
}
#home #me {
  left: 60%;
  top: 0pt;
  width: 20%;
  height: 172pt;
  background-color: #8f8f8f;
}
#home #syncro {
  left: 80%;
  top: 0pt;
  width: 20%;
  height: 172pt;
  background-color: #8f8f8f;
}
#home #sent {
  left: 0%;
  top: 172pt;
  width: 20%;
  height: 344pt;
  background-color: #4f4f4f;
}
#home #pending {
  left: 20%;
  top: 172pt;
  width: 40%;
  height: 344pt;
  background-color: #010102;
}
#home #info {
  left: 60%;
  top: 172pt;
  width: 40%;
  height: 344pt;
  background-color: #4f4f4f;
}
#home #logo {
  left: 0%;
  top: 0;
  width: 0;
  height: 0;
  background-color: #fff;
}
#home #copyright {
  left: 0%;
  top: 516pt;
  width: 100%;
  height: auto;
  padding: 20px 0;
}
#home #me {
  border-right: 1px solid #ccc;
}

#login form .buttons, #profile form .buttons {
  padding-left: 13rem;
}
#login p.hint, #profile p.hint {
  width: 60%;
  max-width: 36rem;
}
#login no-ul.content-grid, #profile no-ul.content-grid {
  width: 30%;
  display: inline-block;
  float: right;
  vertical-align: top;
  margin-top: -40px;
  margin-right: 40px;
}

#logo {
  text-align: center;
}

.lt-1024 #home #datagrip {
  left: 0%;
  top: 0pt;
  width: 50%;
  height: 172pt;
}
.lt-1024 #home #new {
  left: 50%;
  top: 0pt;
  width: 25%;
  height: 172pt;
}
.lt-1024 #home #sent {
  left: 0%;
  top: 172pt;
  width: 25%;
  height: 344pt;
}
.lt-1024 #home #pending {
  left: 25%;
  top: 172pt;
  width: 50%;
  height: 344pt;
}
.lt-1024 #home #me {
  left: 75%;
  top: 0pt;
  width: 25%;
  height: 172pt;
}
.lt-1024 #home #logo {
  left: 75%;
  top: 172pt;
  width: 0%;
  height: 0;
}
.lt-1024 #home #syncro {
  left: 75%;
  top: 172pt;
  width: 25%;
  height: 172pt;
}
.lt-1024 #home #info {
  left: 75%;
  top: 344pt;
  width: 25%;
  height: 172pt;
}
.lt-1024 #home #copyright {
  left: 0%;
  top: 516pt;
  width: 100%;
  height: auto;
}
.lt-1024 #home #info .content-list, .lt-1024 #home #info .content ul.content-grid, .content .lt-1024 #home #info ul.content-grid, .lt-1024 #home #info .content form .form-section > .form-list, .content form .lt-1024 #home #info .form-section > .form-list, .lt-1024 #home #info .content form .form-section > .form-row, .content form .lt-1024 #home #info .form-section > .form-row {
  display: none;
}
.lt-1024 #home #me {
  border-bottom: 1px solid #ccc;
}
.lt-1024 #home #sent .on-bottom {
  margin-left: 0%;
  bottom: 10px;
}

.lt-640 #home #datagrip {
  left: 0%;
  top: 0pt;
  width: 66%;
  height: 172pt;
}
.lt-640 #home #new {
  left: 66%;
  top: 0pt;
  width: 34%;
  height: 172pt;
}
.lt-640 #home #pending {
  left: 33.33%;
  top: 172pt;
  width: 66.66%;
  height: 344pt;
}
.lt-640 #home #sent {
  left: 0%;
  top: 172pt;
  width: 33.33%;
  height: 344pt;
}
.lt-640 #home #info {
  left: 0%;
  top: 516pt;
  width: 33.33%;
  height: 172pt;
}
.lt-640 #home #logo {
  left: 0%;
  top: 516pt;
  width: 0%;
  height: 0%;
}
.lt-640 #home #me {
  left: 33.33%;
  top: 516pt;
  width: 33.33%;
  height: 172pt;
}
.lt-640 #home #syncro {
  left: 66.66%;
  top: 516pt;
  width: 33.33%;
  height: 172pt;
}
.lt-640 #home #copyright {
  left: 0%;
  top: 688pt;
  width: 100%;
  height: auto;
}
.lt-640 #home #sent .on-bottom {
  margin-left: 0;
}
.lt-640 #home #me {
  border-right: 1px solid #ccc;
}
.lt-640 #home #sent {
  border-bottom: 1px solid #ccc;
}
.lt-640 #home #logo {
  border-bottom: 1px solid #ccc;
}
.lt-640 #login ul.form-list, .lt-640 #login .content form .form-section > .form-list, .content form .lt-640 #login .form-section > .form-list {
  width: 100%;
  display: block;
}
.lt-640 #login ul.content-grid, .lt-640 #login .content form .form-section > .content-grid.form-list, .content form .lt-640 #login .form-section > .content-grid.form-list, .lt-640 #login .content form .form-section > .content-grid.form-row, .content form .lt-640 #login .form-section > .content-grid.form-row {
  width: 100%;
  display: block;
  vertical-align: top;
  margin: 0;
  float: none;
}
.lt-640 #login ul.content-grid > li, .lt-640 #login .content ul.content-grid > li, .lt-640 #login .content form .form-section > .content-grid.form-list > li, .content form .lt-640 #login .form-section > .content-grid.form-list > li, .lt-640 #login .content form .form-section > .content-grid.form-row > li, .content form .lt-640 #login .form-section > .content-grid.form-row > li {
  width: 40%;
}

.lt-480 #home {
  /* additional tweaks for some tiles ... */
}
.lt-480 #home #datagrip {
  left: 0%;
  top: 0pt;
  width: 100%;
  height: 90pt;
}
.lt-480 #home #new {
  left: 50%;
  top: 90pt;
  width: 50%;
  height: 132pt;
}
.lt-480 #home #me {
  left: 0%;
  top: 90pt;
  width: 50%;
  height: 132pt;
}
.lt-480 #home #pending {
  left: 50%;
  top: 222pt;
  width: 50%;
  height: 264pt;
}
.lt-480 #home #sent {
  left: 0%;
  top: 222pt;
  width: 50%;
  height: 264pt;
}
.lt-480 #home #syncro {
  left: 50%;
  top: 486pt;
  width: 50%;
  height: 132pt;
}
.lt-480 #home #info {
  left: 0%;
  top: 486pt;
  width: 50%;
  height: 132pt;
}
.lt-480 #home #logo {
  left: 0%;
  top: 618pt;
  width: 100%;
  height: 132pt;
}
.lt-480 #home #copyright {
  left: 0%;
  top: 618pt;
  width: 100%;
  height: auto;
}
.lt-480 #home h2 {
  font-size: 16pt;
}
.lt-480 #home .on-bottom {
  bottom: 4pt;
}
.lt-480 #home #pending em {
  display: none;
}
.lt-480 #home #pending .on-bottom {
  left: 15px;
}
.lt-480 #home #pending ul.content-grid li, .lt-480 #home #pending .content form .form-section > .content-grid.form-list li, .content form .lt-480 #home #pending .form-section > .content-grid.form-list li, .lt-480 #home #pending .content form .form-section > .content-grid.form-row li, .content form .lt-480 #home #pending .form-section > .content-grid.form-row li {
  width: 90%;
  margin: 0;
  margin-bottom: 10px;
  text-align: right;
}
.lt-480 #home #pending ul.content-grid li > a, .lt-480 #home #pending .content form .form-section > .content-grid.form-list li > a, .content form .lt-480 #home #pending .form-section > .content-grid.form-list li > a, .lt-480 #home #pending .content form .form-section > .content-grid.form-row li > a, .content form .lt-480 #home #pending .form-section > .content-grid.form-row li > a {
  font-size: 1.2rem;
  float: right;
}
.lt-480 #home #pending ul.content-grid li > h1, .lt-480 #home #pending .content form .form-section > .content-grid.form-list li > h1, .content form .lt-480 #home #pending .form-section > .content-grid.form-list li > h1, .lt-480 #home #pending .content form .form-section > .content-grid.form-row li > h1, .content form .lt-480 #home #pending .form-section > .content-grid.form-row li > h1, .lt-480 #home #pending ul.content-grid li h2, .lt-480 #home #pending .content form .form-section > .content-grid.form-list li h2, .content form .lt-480 #home #pending .form-section > .content-grid.form-list li h2, .lt-480 #home #pending .content form .form-section > .content-grid.form-row li h2, .content form .lt-480 #home #pending .form-section > .content-grid.form-row li h2 {
  font-size: 22pt;
  display: inline-block;
  float: left;
  margin-top: -6pt;
  margin-bottom: 0;
}
.lt-480 #home #logo img {
  max-width: 80pt;
}
.lt-480 #home #me, .lt-480 #home #syncro, .lt-480 #home #info {
  border: none;
}
.lt-480 #home #me .on-bottom, .lt-480 #home #syncro .on-bottom, .lt-480 #home #info .on-bottom {
  display: none;
}
.lt-480 #home #me .bottom, .lt-480 #home #syncro .bottom, .lt-480 #home #info .bottom {
  display: none;
}
.lt-480 #home #datagrip .on-bottom {
  font-size: 0.8em;
}
.lt-480 #home #datagrip img {
  height: 50px;
}
.lt-480 #home #datagrip p {
  font-size: 0.81rem;
}
.lt-480 #home #sent .on-bottom li {
  margin-bottom: 10px;
}
.lt-480 #login form .buttons {
  padding-left: 0;
}
.lt-480 #login ul.form-list, .lt-480 #login .content form .form-section > .form-list, .content form .lt-480 #login .form-section > .form-list {
  width: 100%;
  display: block;
}
.lt-480 #login ul.content-grid, .lt-480 #login .content form .form-section > .content-grid.form-list, .content form .lt-480 #login .form-section > .content-grid.form-list, .lt-480 #login .content form .form-section > .content-grid.form-row, .content form .lt-480 #login .form-section > .content-grid.form-row {
  width: 100%;
  display: block;
  vertical-align: top;
  margin: 0;
  float: none;
  text-align: center;
}
.lt-480 #login ul.content-grid > li, .lt-480 #login .content ul.content-grid > li, .lt-480 #login .content form .form-section > .content-grid.form-list > li, .content form .lt-480 #login .form-section > .content-grid.form-list > li, .lt-480 #login .content form .form-section > .content-grid.form-row > li, .content form .lt-480 #login .form-section > .content-grid.form-row > li {
  width: 90%;
}

.lt-480 .page .action-bar {
  padding-left: 10pt;
}
.lt-480 .page .container {
  margin-left: 10pt;
}

/* Other additinal tweaks for some tiles ... */
#pending.with-worklists {
  /*
  *	Es la version Pending que debe contener las Worklists
  *	en este caso se usan estilos especiales distintos al
  *	caso standard
  */
}
#pending.with-worklists li.nav, #pending.with-worklists li.link {
  font-size: 10pt;
  width: 5em;
  overflow-x: hidden;
  margin: 0 1em 1em 0;
  text-align: center;
}
#pending.with-worklists li.nav em, #pending.with-worklists li.link em {
  font-size: 16pt;
  background-color: transparent;
  display: block;
  margin: 0;
  padding: 0;
  margin-bottom: 4px;
  width: 2em;
  margin-left: auto;
}
#pending.with-worklists li.nav em.alarm, #pending.with-worklists li.link em.alarm {
  background-color: red;
  color: #fff;
  border-radius: 1em;
}
#pending.with-worklists li.nav a, #pending.with-worklists li.link a {
  font-size: 1em;
  display: block;
  white-space: normal;
  max-height: 2.2em;
  overflow-y: hidden;
}

/*# sourceMappingURL=datagrip.css.map */