
html,
body,
div,
span,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
a,
cite,
code,
em,
img,
ins,
kbd,
q,
small,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
ol,
ul,
li,
tbody,
tfoot,
thead,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
section,
summary,
time,
audio,
video {
  padding: 0;
  margin: 0;
  border: 0;
}
/* Prevents iOS text size adjust after orientation change, without disabling (Thanks to @necolas) */
html {
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}

/* Base styles
-------------------------------------------------- */

body {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
    font-size: 100%;
    line-height: 1.5;
	font-family:Tahoma, Geneva, sans-serif;
  color: #333;
  background-color: #FFF;
}
/* Universal link styling */
a {
  color: #333;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* Removes the dark touch outlines on links */
}
h1{font-size:20px; font-weight:normal;  color:#999; margin:10px 0;}
h2{font-size:18px;   color:#999; }
h3{font-size:16px; }
h3 small{font-size:14px;  color:#999; }
h4{font-size:15px;  }
h4 small{font-size:12px;  color:#999; }
.clear{clear:both;}
/* Wrapper to be used around all content not in .bar-title and .bar-tab */
.content {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  background: #FFF;
  -webkit-transition-property: top, bottom;
          transition-property: top, bottom;
  -webkit-transition-duration: .2s, .2s;  
          transition-duration: .2s, .2s;  
  -webkit-transition-timing-function: linear, linear;
          transition-timing-function: linear, linear;
  -webkit-overflow-scrolling: touch;
}

/* Hack to force all relatively and absolutely positioned elements still render while scrolling
   Note: This is a bug for "-webkit-overflow-scrolling: touch" */
.content > * {
  -webkit-transform: translateZ(0px);
          transform: translateZ(0px);
}
/* Utility wrapper to pad in components like forms, block buttons and segmented-controllers so they're not full-bleed */
.content-padded {
  padding: 10px 5px;
  display:inline-block;
}
.content-padded p {
line-height:22px; 
}

.bar-title ~ .content {
  top: 44px;
}
.bar-tab ~ .content {
  bottom: 51px;
}
.bar-header-secondary ~ .content {
  top: 88px;
}/* General bar styles
-------------------------------------------------- */

[class*="bar-"] {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 10;
  height: 44px;
  padding: 5px;
  box-sizing: border-box;
}

/* Modifier class to dock any bar below .bar-title */
.bar-header-secondary {
  top: 44px;
}

/* Modifier class to dock any bar to bottom of viewport */
.bar-footer {
  bottom: 0;
}


/* Title bar
-------------------------------------------------- */
.bar-title {
  top: 0;
  display: -webkit-box;
  display: box;
  background-color:#0FA6A9;
  box-shadow: inset 0 1px 1px -1px rgba(255, 255, 255, .8);
  -webkit-box-orient: horizontal;
          box-orient: horizontal;
}

/* Centered text in the .bar-title */
.bar-title .title {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height:40px;
  margin-top:5px;
  text-align:center;

}
.bar-title .title img {
  height:37px;
  width: auto;
}

.bar-title > a:not([class*="button"]) {
  display: block;
  width: 100%;
  height: 100%;
}

/* Retain specified title color */
.bar-title .title a {
  color: inherit;
}

/* Generic style for all buttons in .bar-title */
.bar-title [class*="button"] {
  position: relative;
  z-index: 10; /* Places buttons over full width title */
  font-size: 12px;
  box-shadow: 0 1px rgba(0, 0, 0, .25);
  -webkit-box-flex: 0;
          box-flex: 0;
}
/* Position/size search bar within the bar */
.bar-standard input[type=search] {
  height: 32px;
  margin: 0;
}

/* Force form elements to inherit font styles */
input,
textarea,
button,
select {
  font-family: inherit;
  font-size: inherit;
}

/* Stretch inputs/textareas to full width and add height to maintain a consistent baseline */
select,
textarea,
input[type="text"],
input[type=search],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="color"] {
  background: #fff;
  -webkit-appearance: none;
  box-sizing: border-box;
}

textarea {
  background: #fff;
  width:98%;
  margin:10px 0;
  border:2px solid #CCC;
  -webkit-appearance: none;
  box-sizing: border-box;
    border-radius:8px; -moz-border-radius:8px;-webkit-border-radius:8px;
}
textarea:focus {outline:0;}

[class*="button"] {
  position: relative;
  display: inline-block;
  padding: 5px 12px;
  margin:3px  0;
  border-radius:8px; -moz-border-radius:8px;-webkit-border-radius:8px;
  color: #FFF;
  text-align: center;
  vertical-align: top;
  background-color:#0FA6A9;

}

 
/* Active */
[class*="button"]:active {
  color: #FFF;
  background-color:#0FA6A9;
}

.inline{display:inline!important;}

.btn {
	width: 32px; height:32px; border:3px solid #FFF;
  display: inline-block;
  *display: inline;
  margin-bottom: 0;
  *margin-left: .3em;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background:none;
  font-family:"Times New Roman", Times, serif;
 line-height:20px; font-size:20px; color:#FFF;
   border-radius:50%; -moz-border-radius:50%; -webkitborder-radius:50%;

}
.btn:focus {
 outline:none;
}

.swipe-menu{width:35px; height:35px; position:absolute; top:5px; right:5px;  display: inline-block;   z-index: 10; }
.nav-menu{ display:none; position:absolute; bottom:0px; left:0; width:100%; height:auto;  z-index:11; max-height:70%; overflow-y:scroll;}
.nav-menu ul{width:100%; margin:0; padding:0; }
.nav-menu li{float:left; width:100%;  border-bottom:1px solid #FFF;  list-style-type:none;}
.nav-menu a{font-size: 4vmin; position:relative; width:98%; padding:15px 0 15px 2%;  float:left; color:#FFF; text-align:center; display: inline-block;}
.nav-menu li:first-child{border-top:none;}
.converter{width:100%; position:relative; height:100%; margin:0; padding:0;}
.converter-row{background:#FFF; height:30%;width:100%; }
.converter-select{background:#FFF; height:40%; width:100%;}
.alis-satis{width:25%; min-width:45px; min-height:45px; height:100%; float:left; margin:0 4% 0 4%; color:#FFF; font-size:20px; font-size: 4vmin;  text-align:center;  position: relative;display: table;
}
.icon{width:25%; text-align:center;  height:85%; float:left; margin:1% 2% 0 7%;}
.icon img{ height:100%; width:auto; }
.icon2{width:100%;  text-align:center;  height:85%; float:left; margin-top:3%;}
.icon2 img{ height:100%; width:auto; }
.alis-satis span{display: table-cell;
vertical-align: middle; width:100%; height:100%;
}
.currency{background:#FFF; width:25%; float:left; height:100%;}
.currency-selected{background-color:#32557C; width:75%; float:left; height:100%;}
.currency-selected .alis-satis:hover, .currency-selected .alis-satis:active{background:#2B496A;}
.gold-selected{background-color:#EAC117; width:75%; float:right; height:100%;}
.gold-selected .alis-satis:hover, .gold-selected .alis-satis:active{background:#D7AF13;}
.other-icon{background:#FFF; width:25%; float:right; height:100%;}

.converter-value{background:#FFF; height:60%; width:100%;}
.converter-value-row{background:#FFF;  height:50%;width:100%; border-top:2px solid #CCC; position:relative; }
.value-input{width:69%; padding:0 3%; height:100%; margin:0; float:left; border:0;  font-size:26px; font-size:4vmin; display:table;}
.value-input span{display: table-cell; vertical-align: middle; width:100%; height:100%;}
.converter-value-row .value-select{width:25%; background:#EEE; color:#999; text-align:center; display: table; font-size:26px; font-size: 4vmin; height:100%; margin:0; float:right; border:0; }
.converter-value-row .value-select span{display: table-cell;
vertical-align: middle; width:100%; height:100%;
}
.converter-key{ background:#0FA6A9; height:70%;width:100%; position:relative; z-index:10;}
.converter-numbers{height:25%; width:33%; position:relative; text-align:center; color:#FFF; -webkit-box-shadow: 2px 2px 0px 0px rgba(255,255,255,1);
-moz-box-shadow: 2px 2px 0px 0px rgba(255,255,255,1);
box-shadow: 2px 2px 0px 0px rgba(255,255,255,1); float:left;  display:table; font-size:4vmin;}
.converter-numbers span{display: table-cell;
vertical-align: middle; width:100%; height:100%;
}
.numbers-right-side{width:34%; -webkit-box-shadow:0px 2px 0px 0px rgba(255,255,255,1);
-moz-box-shadow: 0px 2px 0px 0px rgba(255,255,255,1);
box-shadow: 0px 2px 0px 0px rgba(255,255,255,1);}
.bg-gold{background:#EAC117; }
.bg-currency{background:#32557C; }
.color-gold{color:#EAC117; }
.color-currency{color:#32557C; }
.font-small{font-size:3vmin!important;}

/*
.backspace {
	position:absolute;
	left:40%;
   width:20%!important; 
   height: 30%!important; 
   background:#FFF;
   text-align:center; font-size:4vmin; font-weight:bold; color:#0FA6A9;
}
.backspace:before {
   height: 0;
   width: 10%;
   content:"";
   top:0;
   left:-38%;
   position: absolute; 
border-right: 2vw solid #FFF;
border-top: 2.5vh solid transparent;
border-bottom: 2.5vh solid transparent;
}*/
.form{width:90%;
  margin:10px; display:block;}
.send {
  float:right;
  position: relative;
  display: block;
  padding: 6px 15px;
  margin:5px 10px;
  border-radius:8px; -moz-border-radius:8px;-webkit-border-radius:8px;
  color: #FFF;
  border:none;
  text-align: center;
  vertical-align: top;
  background-color:#0FA6A9;
}
.pl{left:5px;}
.btn-back {
	border:none;
	color:#FFF;
	font-size:28px;
	width: 32px; height:32px;
  display: inline-block;
  *display: inline;
  margin-bottom: 0;
  *margin-left: .3em;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background:none;
  font-weight:bold;

}
.btn-back:focus {
 outline:none;
}