div.carouselcontainer {
/*  background-color: yellow;*/
/*  border-left: 1px solid #ccc;*/
/*  border-bottom: 1px solid #ccc;*/
  border: 1px solid #d9d9d9;
  box-shadow: 2px 2px 4px #d9d9d9;
  padding: 0px 2px 2px 6px;
/*  margin-top: 8px;*/
  margin-bottom: 16px;
  text-align: left;
}

.stepcarousel{
  position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  height: 128px; /*Height should enough to fit largest content's height*/
  text-align: left;
  vertical-align: middle;
}

.stepcarousel .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}

.stepcarousel .panel{
/*  background-color: aqua;*/
/*  border-top: 1px solid #bbb;
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 8px 20px 1px 5px; /*margin around each panel*/
  text-align: left;
  vertical-align: top;
  width: 558px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}



/*  for the tool landing page*/
.stepcarousel_portfolio {
  position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  height: 595px; /*Height should enough to fit largest content's height*/
  text-align: left;
  vertical-align: middle;
}

.stepcarousel_portfolio .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}

.stepcarousel_portfolio .panel{
/*  background-color: aqua;*/
/*  border-top: 1px solid #bbb;
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 8px 20px 1px 5px; /*margin around each panel*/
  text-align: left;
  vertical-align: top;
  width: 450px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}



/*  income style page*/

.stepcarouselcontainerstyle{
 border: 1px solid #d9d9d9;
  box-shadow: 2px 2px 4px #d9d9d9;
  padding: 0px 2px 2px 6px;
/*  margin-top: 8px;*/
  margin-bottom: 16px;
  text-align: left;
  background-color: #ffffff;
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
/*  margin: 8px 20px 1px 5px;*/ /*margin around each panel*/
  vertical-align: top;
  width: 740px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}

.stepcarousel_style {
  position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  height: 505px; /*Height should enough to fit largest content's height*/
  text-align: left;
  vertical-align: middle;
}

.stepcarousel_style .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}

.stepcarousel_style .panel{
/*  background-color: aqua;*/
/*  border-top: 1px solid #bbb;
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 8px 20px 1px 5px; /*margin around each panel*/
  text-align: left;
  vertical-align: top;
  width: 720px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}


/*  how to style page*/

.stepcarouselcontainerhowto{
  border: 1px solid #d9d9d9;
  box-shadow: 2px 2px 4px #d9d9d9;
  padding: 0px 2px 2px 6px;
/*  margin-top: 8px;*/
  margin-bottom: 16px;
  margin-left:13px;
  text-align: left;
  background-color: #ffffff;
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
/*  margin: 8px 20px 1px 5px;*/ /*margin around each panel*/
  vertical-align: top;
 /*  width: 700px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}

.stepcarousel_howto {
   position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  height: 650px; /*Height should enough to fit largest content's height*/
  text-align: left;
  vertical-align: middle;
}

.stepcarousel_howto .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}

.stepcarousel_howto .panel{
 overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 8px 20px 21px 5px; /*margin around each panel*/
  text-align: left;
  vertical-align: top;
  width: 780px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}


/*  considerations*/

.stepcarouselcontainerconsiderations{
 border: 1px solid #d9d9d9;
  box-shadow: 2px 2px 4px #d9d9d9;
  padding: 0px 2px 2px 6px;
/*  margin-top: 8px;*/
  margin-bottom: 16px;
  margin-left:13px;
  text-align: left;
  background-color: #ffffff;
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
/*  margin: 8px 20px 1px 5px;*/ /*margin around each panel*/
  vertical-align: top;
  width: 700px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}

.stepcarousel_considerations {
  position: relative; /*leave this value alone*/
  overflow: scroll; /*leave this value alone*/
  height: 505px; /*Height should enough to fit largest content's height*/
  text-align: left;
  vertical-align: middle;
}

.stepcarousel_considerations .belt{
  position: absolute; /*leave this value alone*/
  left: 0;
  top: 0;
}

.stepcarousel_considerations .panel{
/*  background-color: aqua;*/
/*  border-top: 1px solid #bbb;
  float: left; /*leave this value alone*/
  overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
  margin: 8px 20px 21px 5px; /*margin around each panel*/
  text-align: left;
  vertical-align: top;
  width: 780px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
  z-index: 200;
}