body /* mods here 2025 */
{
 background: rgb(3,4,94); /* new palete-1 04-17-2025 */
 /* background: rgb(100,100,100); */
 font-family: "Arial";
 font-size: 18px;
 margin-top: 0px;/*4*/
 width:960px;
 margin-left:auto; 
 margin-right:auto;
 /* testing scaling stuff */
   transform: scale(1.0);
   transform-origin: top;
 /* end test */
 line-height: 1.5; /* new palete-1 04-17-2025 */
}

/* new palete-1 04-17-2025 */
@media screen and (orientation: landscape)
{
  #topNav
  {
    display: block;
    float: right;
    margin-bottom: -25px;
  }
  #topNav ul
  {
    list-style: none;
  }
  #topNav li
  {
    display: inline;
    margin-right: 20px;
    font-size: 20px;
  }
  #topNav2
  {
    display: none;
  }
  /**
  .nav
  {
    display: none;
  }
  **/
}
@media screen and (orientation: portrait)
{
  #topNav
  {
    display: none;
  }
  #topNav2
  {
    display: block;
  }
  /**
  .nav
  {
    display: block;
  }
  **/
}


#home
{
 width:960px; 
 height: auto; /*520px;*/ /*480*/
 margin-left:auto; 
 margin-right:auto;
 background: white;
 display: inline-block;
}
#home-left
{
 width:  940px; /*640*/
 height: auto; /*500*; /*460 500*/ /* new palete-1 04-17-2025; */
 margin-top:  5px;
 margin-left: 5px;
 margin-bottom: 5px; /* special fix added July 2020 */
 border: 5px solid rgb(3,4,94); /* rgb(144,224,239); */ /* new palete-1 04-17-2025; */
 /* border: 5px solid rgb(180,180,180); */
 float: left;
}
#home-left-inside
{
 width:  910px; /* 580 */
 height: auto; /*465*/; /*425*/ /* new palete-1 04-17-2025; */
 /* min-height: 800px; */
 margin-top:     15px; /*132*/
 margin-left:  auto; 
 margin-right: auto;
 /* border: 4px solid rgb(180,180,180); */
 /* background: rgba(255,255,150,1.0); */
}

#homeImage
{
  border: 0px solid blue;
  position: relative;
  top: 0px; /*100*/
  font-family: Times;
}

#main-1
{
 width:960px;
 height:520px;
 margin-left:auto;
 margin-right:auto;
 /* display: none; */
}
#tabs-1
{
 height:511px;/* 514*/
}
.ui-tabs-nav
{
 font-family: "Arial";
 font-size: 18px;
}
.contentArea
{
 width:  920px;
 height: 430px;
 margin-left: -10px;
 border: 1px solid white; /* rgb(180,180,180); */
}
#leftDisplayArea
{
 width:  90px;
 height: 295px;
 margin-left:  10px;
 margin-bottom: 4px;
 border: 1px solid white; /* rgb(180,180,180); */
 float: left;
}
#displayArea
{
 width:  800px;
 height: 295px;
 margin-right:  10px;
 margin-bottom: 4px;
 border: 1px solid rgb(180,180,180);
 /* add shadow */
 box-shadow:         2px 2px 2px #818181;
 float: right;
}
/* lab 1 stuff */
#slider
{
 width:  790px;
 margin-left:  20px;
 margin-right: 10px;
 float: left;
}
#amount
{
 width:  65px;
 border:0;
 font-family: "Arial";
 font-size: 16px;
}
.leftSpace40
{
 margin-left: 40px;
}
.leftSpace60
{
 margin-left: 60px;
}
.leftSpace100
{
 margin-left: 100px;
}

.surface-block
{
 width:  95%; 
 height: 50px;
 margin-top:  2px;
 margin-left:  auto; 
 margin-right: auto;
 border: 2px solid rgb(200,200,200);
 font-weight: bold;
 background: linear-gradient(rgb(220,220,220), rgb(180,180,180));
}
.surface-block:hover
{
 font-weight: bold;
 color: white;
 background: linear-gradient(rgb(200,200,200), rgb(140,140,140));
}
.surface-text
{
 margin-top:  15px;
 text-align: center;
 font-size: 18px;
}
.surface-text-smaller
{
 margin-top:  15px;
 text-align: center;
 font-size: 14px;
}
/* end lab 1 stuff */

#navButtonL
{
 width: 120px;
 height:30px;
 margin-top: 5px;
 margin-left: 5px;
 float: left;
}

#back
{
 font-size:20px;
 color: black;
 padding-top: 8px;
 padding-left: 10px;
 float: left;
}

#footer /* mods here 2025 */
{
 width:960px; 
 height:30px; /* 50 for portrait and 30 for landscape */
 margin-left:auto; 
 margin-right:auto; 
 margin-top: -4px; /* 5px is actually needed here ... */
 margin-bottom: 5px;
 background: linear-gradient(rgb(0,180,216), rgb(255,255,255), rgb(0,180,216));/* new palete-1 04-17-2025 */
 /* background: linear-gradient(rgb(190,190,190), rgb(255,255,255), rgb(190,190,190));*/ /* Jan 2025 */
 /*background: linear-gradient(rgb(220,220,220), rgb(180,180,180));*/
 border-radius: 5px 5px 5px 5px; /* try again Jan 2025 */
 /* border-radius: 0px 0px 10px 10px; */ /* new July 2020 */
}
#footerMessage /* mods here 2025 */
{
 /*padding-top: 7px;*/
 color: rgb(120,120,120);
 /*
 font-family: Times;
 font-style: italic;
 */
 text-align: center;
 font-size: 16px; /* mods here 2025 */ /* was 12px */
 line-height: 30px; /* new 2025 */
}
a
{
 /* display: block; */
 /* font-weight: bold; */
 text-decoration: none;
 color: rgb(3,4,94); /* new palete-1 04-17-2025 */
}
a.black
{
 display: block;
 font-weight: bold;
 text-decoration: none;
 color: black;
}
p
{
 padding-left:  10px;
 padding-right: 10px;
 font-family: "Arial";
 font-size: 18px;
 line-height: 1.5;
}
h1,h2,h3
{
 padding-left:  20px;
 padding-right: 20px;
 font-family: "Arial";
}
h1
{
  font-size: 22px;
}

fieldset
{
 margin-top: 10px;
 margin-left:  auto; /*auto;*/
 margin-right: auto;
 padding: 10px;
 font-size: 18px;
 font-family: "Arial";
 width:  835px; /* 835 395 new palete-1 04-17-2025; */
 height: auto; /* 310 new palete-1 04-17-2025 */
 background: rgba(144,224,239, 0.30); /* new palete-1 04-17-2025 */
 border: 4px solid rgb(3,4,94); /* new palete-1 04-17-2025 */
 /*border: 1px solid black;*/
 border-radius: 10px 10px 10px 10px; /* new palete-1 04-17-2025 */
}

/*form label .textInput*/
.textInputLabel
{
  width: 100px;
  display: inline-block;
}
.textInputLabelLarge
{
  width: 150px;
  display: inline-block;
}
/*form input*/
.textInput
{
  width: 620px; /*220 230*/ /* new palete-1 04-17-2025 */
  height: 30px; /* 20 new palete-1 04-17-2025 */
  background: white !important; /* new palete-1 04-17-2025 */
  padding: 5px 8px;
  font-size: 18px;
}

.textInputSmall
{
  width: 170px; /*180*/
  height: 20px;
  padding: 5px 8px;
  font-size: 12px; /* 16px; */
}
/* form ul */
#stepOne ul, #stepTwo ul, #stepThree ul
{
  list-style: none;
  padding-left: 10px;
  padding-right: 10px;
}
/* form li */
#stepOne li, #stepTwo li, #stepThree li
{
  padding: 9px;
}
.bottomBorder
{
  border-bottom: 1px solid rgba(3,4,94,0.5);
}

#explainStepFour /* css for the revisit page bits */
{
  margin-top: 10px;
  margin-left:  22px; /*auto;*/
  /*margin-right: auto;*/
  padding: 10px;
  font-size: 18px; /*16*/
  font-family: "Arial";
  width:  845px; /*395*/
  height: 305px; /*310*/
  /* background: rgba(144,224,239, 0.30); */ /* new palete-1 04-17-2025 */
  background: rgb(255,255,255);
  border: 4px solid rgb(3,4,94); /* new palete-1 04-17-2025 */
  /* border: 1px solid black; */
  float: left;
}
#explainStepFour ul
{
  list-style: none;
  margin-top: 8px;
  padding-left: 10px;
  padding-right: 10px;
}
#explainStepFour li
{
  padding: 9px;
}

#progressbar
{
  width: 384px; /*400*/
  position: absolute;
  left: 30%;
  top: 25%;
}
#progressbarLabel
{
  position: absolute;
  left: 167px; /*175*/
  top: 7px;
  font-weight: bold;
  text-shadow: 1px 1px 0 #fff;
}


.signIn
{
 width: 280px;
 height: 24px;
 font-size: 16px;
 font-family: "Arial";
}

.small
{
 font-size: 12px;
 font-family: "Arial";
}
.big
{
 font-size:20px;
 font-weight: bold;
}
.bold
{
 font-weight: bold;
}
.center
{
 text-align: center;
}
.blue
{
 color: blue;
}
.em
{
 font-style: italic;
}

.myButton
{
 height: 40px;
 margin-left: 10px;
 font-family: "Arial";
 font-size:16px;
 font-weight: bold;
 /* add shadow */
 box-shadow:         2px 2px 2px #818181;
}

.scrolly
{
 /* height:440px !important; */ /* 450 */
 overflow: auto;
}