@charset "utf-8";
/* CSS Document */

/*********************************************************************
 * News "medical" color scheme is derived from this starting point:
 * http://www.dynamicgraphics.com/dgm/Article/28661
 *
 * Then the a variety was applied via "Color Scheme Designer" to produce this
 * scheme:
 * http://colorschemedesigner.com/#3H61Tf6Dyw0w0
 *
 * Colors:
 * darkblue: #24457D
 * medblue:  #627390
 * lightblue: #ABBEE0
 * gray: #ff6c00
 * (oh, just see below...)

*** Primary Color (blues):

   var. 1 = #6E8CC0 = rgb(110,140,192)
   var. 2 = #627390 = rgb( 98,115,144)
   var. 3 = #24457D = rgb( 36, 69,125)
   var. 4 = #98B2E0 = rgb(152,178,224)
   var. 5 = #ABBEE0 = rgb(171,190,224)

*** Secondary Color A (purples):

   var. 1 = #8274C5 = rgb(130,116,197)
   var. 2 = #6E6694 = rgb(110,102,148)
   var. 3 = #362680 = rgb( 54, 38,128)
   var. 4 = #A99CE2 = rgb(169,156,226)
   var. 5 = #B8AFE2 = rgb(184,175,226)

*** Secondary Color B (greens):

   var. 1 = #62B9AD = rgb( 98,185,173)
   var. 2 = #5A8B84 = rgb( 90,139,132)
   var. 3 = #20786C = rgb( 32,120,108)
   var. 4 = #8EDCD1 = rgb(142,220,209)
   var. 5 = #A3DCD4 = rgb(163,220,212)

*** Complementary Color (oranges):

   var. 1 = #FFD487 = rgb(255,212,135)
   var. 2 = #BFA77C = rgb(191,167,124)
   var. 3 = #A67A2C = rgb(166,122, 44)
   var. 4 = #FFDFA5 = rgb(255,223,165)
   var. 5 = #FFE7BD = rgb(255,231,189)

 */

/*********************************************************************
 * Formatting
 */

* { margin: 0; padding: 0; }
img { display: block; border: 0; }
table { border-collapse: collapse; }
ol,ul { list-style-position: inside; }
p { margin-bottom: 18px; }
ul { margin-left: 0; margin-bottom: 18px; padding-left: 5px; }
html { font-size: 87.5%; background-color: #fff; height: 100%; }

a:link { color: #28588E; text-decoration: none; font-weight: bold; }
a:visited { text-decoration: none; font-weight: bold;

  border-radius:4px;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
}
a:hover { text-decoration: underline; }
a:active { text-decoration: none; }
#topmenu-user a { color: #28588E; color: white; text-decoration: none; font-weight: bold; }

h1,h2,h3,h4,h5,h6 { margin-bottom:7px; overflow:hidden; font-style: normal; }
h1 { font-size: 1.4em; margin-bottom: 18px; color: darkgray;}
h2 { font-size: 1.3em; }
h3 { font-size: 1.2em; }
h4 { font-size: 1.1em; }
h5 { font-size: 1em; }
h6 { font-size: 0.9em; }


/*********************************************************************
 * Positioning
 */

body {
  position:relative;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-size: 1em;
  line-height: 1.65;
  /*
  background: #7ba9db url(http://cdn.ugraph.com/site_media/images/front/bg.jpg) repeat-x;
  background: #6E8CC0 url(http://cdn.ugraph.com/site_media/images/front/bg2.jpg) repeat-x;
  */
  background: #bbb url(http://cdn.ugraph.com/site_media/images/front/bg6.png) repeat-x;
  height: 100%;
  height:auto !important;
  min-height:100%;
}

#page {
  position: relative;
  margin: 0 auto;
  width: 100%;
  background: #7ba9db url(http://cdn.ugraph.com/site_media/images/front/bg_border2.jpg) repeat-y;
  height: 100%;
  height:auto !important;
   min-height:100%;
  /* Can't do fluid due to fixed bg border. */
  /*
  min-width: 760px;
  max-width: 1000px;
  */
  width: 794px;
  overflow: hidden;
  z-index: 2;
  
}

#header {
  width: 100%;
  position: relative;
  float: left;
  padding-top: 2px;
  margin-bottom: 9px;
  z-index: 2;
  
}

#logo {
  padding: 0px 10px;
  float: left;
  z-index: 5;
}

#topmenu-user {
  font-size: 14px;
  color: #545559;
  color: white;
  position: absolute;
  float: right;
  background-image: url(http://cdn.ugraph.com/site_media/images/front/topmenuback2.jpg);
  width: 510px;
  height: 58px;
  top: 10px;
  right: 2px;
  padding-right: 0px;
  padding-top: 0px;
  z-index: 20;
  
}

#topmenu-user-text {
  position: absolute;
  top: 18px;
  left: 30px;
}
/* End header section */

#content {
  position: relative;
  width: 100%;
  float: left;
  margin-bottom: 1em;
   height:auto !important;
	height:100%;
  
}

/* single-column layout */
#onlycol {
  position:relative;
  height:auto !important;
  height:100%;
  z-index: 15;
  padding: 15px 100px 0px 100px;
}

/* 2-column layout */
#maincol {
  width: 65%%;
  float: left;
  width: 440px;
  min-height: 260px;
  padding: 1.795%;
  margin-left: 10px;
  float:left;
  border-radius: 7px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-style: solid;
  border-width: 1px;
  border-color: #abbee0;
}

#subcol {
  background: #FFE7BD;
  background: #E8EDF6;
  width: 33%;
  width: 264px;
  min-height: 259px;
  float: right;
  margin-right: 10px;
  margin-left: 0.385%;
  padding: 1.795%;
  border-radius: 7px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-width: 1px;
  border-style: solid;
  border-color: #abbee0;
  font-size: 80%;
}

/* Footer sections */
#footer {
  float: left;
  padding: 45px 100px 0px 100px;
  text-align: center;
  padding-bottom: 120px;
}

#footer p {
  margin: 2px 0 2px 0;
}

p#exits {
  /*background: rgb(227, 227, 227);*/
  /*text-align: center;*/
}

p#legal {
  color: gray;
  font-size: 10px;
  text-align: center;
  margin-top: 0px;
  padding-top: 0px;
}

/* Background stuff. */
#wordle {
  position: absolute;
  background-image: url(http://cdn.ugraph.com/site_media/images/front/wordle2.png);
  height: 223px;
  width: 100%;
  top: 50px;
  left: 0px;
  z-index: 0;
}

/* Uncommon error markup. */
ul.errorlist {
  color: red;
}