/* colors sorted by brightness */
@white: #fff, #f5f5f5, #eee;
@lightGrey: #d7d7d7, #cccdd1, #ccc, #999;
@darkGrey: #666, #60636a, #40434c, #32353e;
@azure: #54a7db, #0099FF;
@black: #000;
@yellow: #E3E1B8, #F9DF6B;

/* media queries */

/* standard landscape view: landscape browser window + landscape device screen  */
@landscape: ~"all and (orientation: landscape) and (min-device-aspect-ratio: 1/1)";

/* keyboard is open on a mobile device: landscape browser window + portrait device screen */
@mobile-portrait-with-keyboard: ~"all and (orientation: landscape) and (max-device-aspect-ratio: 1/1)";

/* narrowed desktop window: portrait browser window + landscape device screen  */
@desktop-portrait: ~"all and (orientation: portrait) and (min-device-aspect-ratio: 1/1)";

/* mobile device in portrait orientation: portrait browser window + portrait device screen */
@mobile-portrait: ~"all and (orientation: portrait) and (max-device-aspect-ratio: 1/1)";

/* more specific media queries */
@phone-portrait: ~"all and (orientation: portrait) and (max-device-aspect-ratio: 1/1) and (max-device-width: 480px)";
@phone-portrait-with-keyboard: ~"all and (orientation: landscape) and (max-device-aspect-ratio: 1/1) and (max-device-width: 480px)";

@tablet-portrait: ~"all and (orientation: portrait) and (max-device-aspect-ratio: 1/1) and (min-device-width: 481px)";
@tablet-portrait-with-keyboard: ~"all and (orientation: landscape) and (max-device-aspect-ratio: 1/1) and (min-device-width: 481px)";

@phone-landscape: ~"all and (orientation: landscape) and (min-device-aspect-ratio: 1/1) and (max-device-width: 959px)";
@tablet-landscape: ~"all and (orientation: landscape) and (min-device-aspect-ratio: 1/1) and (min-device-width: 960px) and (max-device-width: 1366px)";
@desktop-landscape: ~"all and (orientation: landscape) and (min-device-aspect-ratio: 1/1) and (min-device-width: 1367px)";

/* Fix for FireFox - some ionicons did not display properly */
@font-face {
  font-family: 'ionicons';
  src: url('html5client/packages/ionicons/fonts/ionicons.woff') format('woff'),
       url('html5client/packages/ionicons/fonts/ionicons.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}