/* default size is 16px */
/* reset CSS to reduce browser inconsistancy (but this makes cellpadding not working anymore) */
/* * { margin: 0; padding: 0; } */
/* padding : top right bottom left */

/* top of above-the-fold section */
ul { padding:0px 0px 0px 40px; }
@font-face { /* Magra font normal */
  font-family: 'Magra';
  font-style: normal;
  font-weight: 400;
  src: local('Magra'), url(/fonts/Magra.ttf) format('truetype');
}
@font-face { /* Magra font bold */
  font-family: 'Magra';
  font-style: normal;
  font-weight: 700;
  src: local('Magra Bold'), local('Magra-Bold'), url(/fonts/Magra-Bold.ttf)
  format('truetype');
}
/* compactness: Arial<Helvetica<Verdana=Georgia=sans-serif (Arial, Helvetica,
   and Verdana are sans-serif fonts) Arial and Helvetica are known by most
   browsers. Arial is the most compact of the sans-serif fonts. Depending of
   the brower, "sans-serif" is either Arial or Helvetica. List of safe fonts:
   arial, arial black, comic sans ms, courier, courier new, georgia,
   helvetica, impact, palatino, times new roman, trebuchet ms, verdana.  */
body { 
  margin-left:0; margin-top:0; margin-right:0; margin-bottom:0; 
  font-family:Droid Sans,Arial,Helvetica,sans-serif; color:#444444; font-size:15px; line-height:1.5;
  webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -o-hyphens: auto;
  hyphens: auto;
  background-color:white;
}
#blackbar { 
  position:fixed; z-index: 999; top:0; left:0; width:100%; background-color:black; color:white;
  line-height:2.0;
}
#blackbar a { outline:0; text-decoration:none; color:white; }
#blackbar a:hover { text-decoration: none; color:white; padding-bottom:2px; border-bottom:3px solid #008080; }
#menubar { 
  width:100%; color:black; padding:0px; background-color:#e8e8e8; 
  border-top:2px solid #e8e8e8; border-bottom:2px solid #e8e8e8; line-height:1.0;
  font-family:Magra;
  font-size:18px;
  color:#808051;
  /* for chrome on Windows */
  -webkit-text-stroke-width: .3px;
}
#menubar a { outline:0; text-decoration: none; color:#008080; margin:0px 10px 0px 10px; }
#menubar a:hover { outline:0; text-decoration: none; color:#008080; padding-bottom:2px; border-bottom:4px solid #008080; }
#whole-page { margin-top:10px; margin-bottom:10px; background-color:#ffffff; }
.home_banner {
position:relative;
width:100%;
height:170px;
padding:70px 0px 0px 0px;
background-color:#ccdddd;
background-image:url(/news_1400x290_light.jpg);
background-repeat:no-repeat;
background-position:50%;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover; /* scale img to cover area */
font-size:90px;
color:#ffffff;
}
.transparent_banner {
  text-align:left; /* html5 */
  width:900px;
  padding:20px 15px 10px 15px;
  background:rgba(255,255,255,0.8);
  font-family:Magra;
  font-style:italic;
  font-weight:bold;
  font-size:20px;
  color:#006060;
  text-shadow: 1px 3px 1px #cccccc;
}
.middle { border:0; vertical-align:middle; }
/* end of above-the-fold */

input[type="checkbox"] { padding:0px; margin:3px 10px 0px 10px; }
fieldset { padding:10px 10px 10px 10px; }
legend { padding:0px 3px 0px 3px; } 
option { padding:0px 10px 0px 0px; } 
table { border-collapse:separate; }
/* rule to fix quirks-mode inheritance behavior for tables */
table, caption { font-size: inherit; font-weight: inherit; font-style: inherit; font-variant: inherit; }
#specs { border-collapse:collapse; border-color:#ff0000;}
#specs td, #specs th { border:1px solid #008080; padding:5px 5px 5px 5px; line-height:1.3; }
/* Droid font: Google/Android font for small screen (Apache license) */
@font-face {
  font-family: 'Droid Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Droid Sans'), local('DroidSans'), url(/fonts/DroidSans.ttf)
  format('truetype');
}
@font-face {
  font-family: 'Droid Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Droid Sans Bold'), local('DroidSans-Bold'),
  url(/fonts/DroidSans-Bold.ttf) format('truetype');
}
#whole-page-phone { margin-top:0; margin-bottom:0; background-color: #ffffff; }
.redbold { font-family:Arial,Helvetica,sans-serif; color:#6e4600; font-weight:bold; font-size:17px; }
.imgban { display:block; width:1400px; height:290px; border:0; }
.imgban2 { display:block; width:900px; height:60px; border:0; }
#footsection { 
  width:100%;
  color:white;
  padding:10px 0px 20px 0px;
  background-color:#000000; 
  font-size:13px;
}
#footsection a { outline:0; text-decoration:none; color:white; padding-bottom:1px; border-bottom:1px solid #888888;}
#footsection a:hover { outline:0; text-decoration:none; color:white; padding-bottom:1px; border-bottom:2px solid #eeca61; }
#followussection { line-height:1.8; }
#followussection a { outline:0; text-decoration:none; color:white; padding:0; border:0; }
#followussection a:hover { outline:0; text-decoration:none; color:white; padding:0; border:0; font-weight:bold; }
.imgtxt {
display: block;
position:relative;
z-index:10;
height:0;
line-height:0;
color:#ffffff;
font-family:Verdana,sans-serif;
font-size:15px;
font-weight:bold; 
text-shadow:1px 1px 1px #000000;
}
.bannertext1 {
 margin:0;
 border:0;
 padding:0px 0px 0px 10px;
 font-family:Hevetica,sans-serif;
 font-size:46px;
 font-style:normal;
 font-weight:normal;
 color:#ffffff;
 text-shadow:2px 2px 2px #000000;
 filter: DropShadow(offx=2,offy=2,color=#000000);
}
.bannertext2 {
 padding-left:7px;
 font-family:Palatino;
 font-style:italic;
 font-size:42px;
 text-shadow:1px 1px 1px #000000;
 filter: Shadow(Color=#000000,Direction=135,Strength=1);
}
.bannertext3 {
  text-wrap:none;
  text-align:right;
  padding-top:30px;
  padding-right:5px;
  float:right;
  font-family:Verdana,sans-serif;
  font-size:15px;
  font-weight:bold; 
  color:#ffffff;
  text-shadow:1px 1px 1px #000000;
  filter: Shadow(Color=#000000,Direction=135,Strength=1);
}
ul { list-style-image:url(/listblue2filled.gif); list-style-type:square; }
ul.menu { list-style-image:none; list-style-type:none; margin:0; padding-left:0px; padding-right:10px; font-size:16px;
	border-right:1px solid #d4deea; margin-right:30px; font-size:15px;}
.menu li { border-bottom:10px solid white;
  -moz-hyphens:none;
  -ms-hyphens:none;
  -o-hyphens:none;
  hyphens:none;
}
.menu li a { outline:0; display:block; padding:7px; background-color:#ffffff; hyphens:none; margin-right:0px; line-height:1.2;}
.menu li a:link { text-decoration:none; color:#008080;}
.menu li a:visited { text-decoration:none; color:#008080; }
.menu li a:hover { text-decoration:none; color:#ffffff; background-color:#008080; }
.menu li a:active { text-decoration:none; color:#008080; }
#tdmenu { width:158px; background-color:#ffffff; padding:0; }
table.hmenu { border:2px outset #222222; margin: 0px 0px 10px 0px; border-spacing:0px; background-color:#aaaaaa; }
table.hmenu td { white-space:nowrap; border-width:0px; border-style:solid; padding:0px 0px 0px 1px; border-color:#888888 #444444 #888888 #ffffff;}
/* class2: used everywhere */
.class2 a:link {text-decoration: none; color:#008080;}
.class2 a:visited {text-decoration: none; color:#008080;}
.class2 a:hover {text-decoration: underline; color:#008080;}
.class2 a:active {text-decoration: underline; color:#008080;}
/* class3: for boldtext section */
.class3 a:link {text-decoration: none; color:#505060;}
.class3 a:visited {text-decoration: none; color:#505060;}
.class3 a:hover {text-decoration: underline; color:#505060;}
.class3 a:active {text-decoration: underline; color:#505060;}
/* class4: used in news and pub pages */
.class4 a:link {text-decoration: none; color: #444444;}
.class4 a:visited {text-decoration: none; color: #444444;}
.class4 a:hover {text-decoration: underline; color:#008080;}
.class4 a:active {text-decoration: none; color: #444444;}
/* class5: used for button with white text */
.class5 a:link {text-decoration: none; color:#ffffff;}
.class5 a:visited {text-decoration:none; color:#ffffff;}
.class5 a:hover {text-decoration:none; background: #dddddd; color:#555555; text-shadow:1px 1px #ffffff;}
.class5 a:active {text-decoration: none; color:#555555;}
.class5 a { float:right; padding:3px 3px 3px 3px; margin: 0px; font-family:Droid sans,Arial,Verdana,sans-serif; font-size:18px; font-weight:normal;letter-spacing:1px; }
.bold a { font-weight:bold; }
/* class6: used for invisible links on regular text */
.class6 a:link {text-decoration:none; color:#606061;}
.class6 a:visited {text-decoration:none; color:#606060;}
.class6 a:hover {text-decoration:none; color:#404040;}
.class6 a:active {text-decoration:none; color:#606060;}
/* class7: used for box with white text */
.class7 a:link {text-decoration: none; color:#ffffff;}
.class7 a:visited {text-decoration:none; color:#ffffff;}
.class7 a:hover {text-decoration:none; background: #dddddd; color:#555555; text-shadow:1px 1px #ffffff;}
.class7 a:active {text-decoration: none; color:#555555;}
.class7 a { display:block; white-space: nowrap; border:1px solid #666666; background-image:url('/buttonbg3.gif'); padding: 5px 5px 5px 8px; margin:0px; font-family:Verdana,sans-serif; font-size:15px; font-weight:bold; }
.tiny { font-size:10px; }
p { padding: 0px 0px 0px 0px; margin: 14px 0px 14px 0px; }
h1 { /* page titles */
  text-align:center;
  font-family: "Arial", "Helvetica", sans-serif;
  font-style: normal;
  font-size: 36px;
  line-height: 1.1;
  font-weight: bold;
  /* text-shadow: 1px 3px 1px #cccccc; */
  color: #007070; /* dark blue */
  padding: 0px 0px 9px 0px;
  margin: 18px 0px 20px 0px;
  border-bottom: 1px solid #D4DEEA;
  /* for chrome (on Windows) */
  -webkit-text-stroke-width: .7px;
}
h2 { /* section titles */
  font-style: normal;
  font-size: 24px;
  line-height: 1.1;
  font-weight: bold;
  /* color: #002a5c; */ /* dark blue */
  color: #006060; /* dark blue */
  padding: 10px 0px 0px 0px;
  margin: 12px 0px 12px 0px;
  border-top: 1px solid #D4DEEA;
}
.firsth2 { border:0; padding:0; margin:0 0 12px 0; } 
h4 { /* not used */
  font-size: 17px;
  line-height: 22px;
  font-weight: normal;
  color: #a2233e; /* dark red */
  margin: 0px 0 0 0;
}
th { line-height: 1.2; }
.largeboldtext {
  font-size: 20px;
  line-height: 1.4;
  color: #222222;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:justify;
}
.boldtext {
  font-size: 15px;
  line-height: 1.4;
  color: #666666;
  font-weight: bold;
  margin: 0px 0px 0px 0px;
  text-align:justify;
}
.normaltext {
  font-size: 15px;
  line-height: 1.5;
  color: #444444;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:justify;
}
.normaltextleft {
  font-size: 15px;
  line-height: 1.5;
  color: #444444;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:left;
}
.normaltextleft2 {
  font-size: 17px;
  line-height: 1.5;
  color: #444444;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:left;
}
.normaltextborder {
  font-size: 15px;
  line-height: 1.5;
  color: #444444;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:justify;
  border-top:1px solid #D4DEEA;
  border-bottom: 1px solid #D4DEEA;
}
.normaltextleftborder {
  font-size: 15px;
  line-height: 1.5;
  color: #444444;
  font-weight: normal;
  margin: 0px 0px 0px 0px;
  text-align:left;
  border-top:1px solid #D4DEEA;
}
.topborder {
  border-top:1px solid #D4DEEA;
}
.imgapp {
  width:100px;
  float:left; 
  vertical-align:text-top;
  padding:0 10px 0 0;
}
.imgfapp {
  width:122px;
  float:left; 
  vertical-align:text-top;
  padding:0 10px 0 0;
}
.imgfapp2 {
  width:244px;
  float:left; 
  vertical-align:text-top;
  padding:0px 10px 0 0;
}
.imgfapp2r {
  width:244px;
  float:right; 
  vertical-align:text-top;
  padding:0 10px 0 10px;
}
.scaps {
  font-size: 11px;
  font-weight: normal;
}
.footnote {
  font-size: 14px;
  line-height: 17px;
  color: #606060;
  font-weight: normal;
  padding: 10px 0px 0px 0px;
  margin: 15px 0px 0px 0px;
  border-top: 1px solid #D4DEEA;
}
.audiospan {
  font-size: 10px;
  color: #606060;
  font-weight: normal;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}
/* used in faqs.html */
.boxtext {
  /* text-align:justify; */
  font-size: 15px;
  color: #4c4c4c; 
  text-shadow: 1px 1px #ffffff;
  background: #e0e0e0;
  font-weight: normal;
  padding: 5px 10px 5px 10px;
  margin:0px;
}
.boxtext ul { list-style-position:inside; margin:0; padding-left:25px; padding-right:0px; font-style:normal; font-size:16px; list-style-type:disc; list-style-image:none; }
.boxtext li { font-size:16px; padding:5px 0px 5px 0px; margin:5px; }

/* rbox, rhead for box with gradient and shadowed text */
.rbox {
  display: block;
  height: inherit;
  zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
  /* display: inline; */
  vertical-align: baseline;
  margin:0;
  outline: none;
  font: 15px Arial,Verdana,sans-serif;
  line-height: 18px;
  padding:0;
  /* text-shadow: 0 1px 1px rgba(0,0,0,.3); */
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px;
  border-radius: 5px;
  color: #008080;
  border: 1px solid #008080;
  background: url('/stripe-bg.png') repeat;
}
#mainbox { padding-left:5px; padding-right:5px; }
#rbox1 { width:380px; vertical-align:top; height:100%; }
#rbox2 { width:312px; vertical-align:top; height:100%; }
#rleft1 { width:46px; }
#rleft2 { width:60px; }
#rlist2 { margin:10px; }
#rhead1, #rhead2 {  /* use IDs instead of a class for precedence reasons */
  text-decoration: none;
  display:block;
  zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
  /* display: inline; */
  vertical-align: middle;
  margin:0;
  outline: none;
  text-align: left;
  text-decoration: none;
  font:15px Verdana,sans-serif;
  font-weight:bold;
  padding: 5px 0px 5px 10px;
  margin: 0px;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
  color:#ffffff;
  background: #6e6e6e;
  background: -webkit-gradient(linear,left top,left bottom,from(#aaaaaa),to(#333333));
  background: -moz-linear-gradient(top,#aaaaaa,#333333);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa',endColorstr='#333333');
}
#rhead1 { width:370px; }
#rhead2 { width:302px; }
#rhead1:hover, #rhead1:active, #rhead2:hover, #rhead2:active {
  text-shadow: 0 1px 1px rgba(0,0,0,.3);
  background: #dddddd;
  color:#555555;
  filter:none;
}
.rbox ul { list-style-position: inside; margin:0; padding-left:25px; padding-right:0px; padding-bottom:3px;
   font-style:normal; font-size:16px; line-height:0.9; list-style-type:disc; list-style-image:none; }
.rbox li { font-size: 16px; padding: 5px 0px 5px 0px; margin: 5px;}
.rbox li a:link {text-decoration:none; color:#008080}
.rbox li a:visited {text-decoration:none; color:#008080}
.rbox li a:active {text-decoration:none; color:#008080}
.rbox li a:hover {text-decoration:none; color:#008080; padding-bottom:3px; border-bottom:3px solid #eeca61; }
.fbox {
  display: block;
  height: inherit;
  width: inherit;
  zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
  vertical-align: baseline;
  margin:0;
  outline: none;
  font-size: 12px;
  line-height: 15px;
  -webkit-text-size-adjust: none; /* for iPhone */
  padding: 5px 0 5px 0;
  margin: 0;
  color: #aaaaaa;
  background: #333333;
}
.fbox a:link { text-decoration: none; color:#aaaaaa; }
.fbox a:visited { text-decoration: none; color:#aaaaaa; }

/* use in local pages */
pre { /*\*/ overflow: auto !important; /* */ overflow: scroll; width: 96%; padding: 10px; margin: 10px; margin-left: 0;}
pre { font-size: 13px; color:#404040; background-color:#D8E8FF; }
#li { width: 300px }

.arg { color: #888; }

/* saas status button */
.button2 {
  background:#feda71;
  color:#000000;
  background:-moz-linear-gradient(top,#feda71 0%,#fe8820 100%);
  background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#feda71),color-stop(100%,#fe8820));
  background:-webkit-linear-gradient(top,#feda71 0%,#fe8820 100%);
  background:-o-linear-gradient(top,#feda71 0%,#fe8820 100%);
  background:-ms-linear-gradient(top,#feda71 0%,#fe8820 100%);
  background:linear-gradient(top,#feda71 0%,#fe8820 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#feda71',endColorstr='#fe8820',GradientType=0);
  padding:5px 18px;
  font-size:14px;
  border-radius:48px;
  -moz-border-radius:48px;
  -webkit-border-radius:48px;
  border:1px solid #fea840;
}
a.button2 { outline:0;}
a.button2:link { text-decoration:none; color:#000000;}
a.button2:visited { text-decoration:none; color:#000000; }
a.button2:hover { text-decoration:none; background:#feda71;}
a.button2:active { text-decoration:none; color:#000000; background:#fe8820; }