body {
  font-family: Arial, sans-serif;
  padding-top: 50px;
}
body p,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body label,
body input,
body button {
  font-weight: normal;
}
.mc-tool {
  display: block;
  width: 100%;
  max-width: 500px;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.25;
  color: #6f6f6f;
  background: #ffffff;
  border-top: 1px solid #d9d9d9;
  border-bottom: 1px solid #d9d9d9;
}
.mc-tool p,
.mc-tool h1,
.mc-tool h2,
.mc-tool h3,
.mc-tool h4,
.mc-tool h5,
.mc-tool h6,
.mc-tool label,
.mc-tool input,
.mc-tool button {
  margin: 0 0 10px;
}
.mc-tool .wrapper.active {
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.65);
}
.mc-tool .mc-header h2 {
  font-size: 30px;
  color: #008ccc;
  margin: 13px 0px 20px;
  display: block;
}
.mc-tool .mc-entry p,
.mc-tool .questionset p {
  color: #54585a;
}
.mc-tool .mc-entry label,
.mc-tool .questionset label,
.mc-tool .mc-entry legend,
.mc-tool .questionset legend {
  display: block;
  color: #008ccc;
  font-weight: bold;
  position: relative;
  max-width: 100%;
}
.mc-tool .mc-entry .input,
.mc-tool .questionset .input,
.mc-tool .mc-entry select,
.mc-tool .questionset select {
  font-size: 18px;
  line-height: 18px;
  height: 37px;
  appearance: textfield;
  -webkit-appearance: textfield;
  font-weight: bold;
  color: #1e1e1e;
  border-radius: 5px;
  border: 1px solid #d9d9d9;
  padding: 0 9px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.mc-tool .mc-entry select,
.mc-tool .questionset select {
  padding: 0 0 0 9px;
}
.mc-tool .mc-entry fieldset span.sub,
.mc-tool .questionset fieldset span.sub {
  margin-bottom: 0;
  margin-top: 0;
}
.mc-tool .mc-entry span.sub,
.mc-tool .questionset span.sub {
  display: block;
  color: #008ccc;
  font-size: 14px;
  margin-top: -10px;
  margin-bottom: 10px;
  position: relative;
}
.mc-tool .mc-entry #units,
.mc-tool .questionset #units {
  background-color: #f5f5f3;
  background-image: url("/~/media/KCMS/GBS/Interactive Tools/Images/Pregnancy/icons/world.ashx");
  background-position: 7px center;
  background-repeat: no-repeat;
  border-radius: 5px;
  border: none;
  height: 27px;
  padding-left: 33px;
  padding-right: 12px;
  font-size: 14px;
  line-height: 1;
  margin-bottom: 20px;
  color: #616161;
}
.mc-tool .mc-entry #units span,
.mc-tool .questionset #units span {
  font-weight: bold;
}
.mc-tool .mc-entry #units:hover,
.mc-tool .questionset #units:hover,
.mc-tool .mc-entry #units:focus,
.mc-tool .questionset #units:focus {
  background-color: #deded7;
}
.mc-tool .mc-entry span.unit,
.mc-tool .questionset span.unit {
  height: 35px;
  color: #6f6f6f;
  font-weight: normal;
  font-size: 14px;
  line-height: 35px;
  margin: 0 7px;
}
.mc-tool .mc-results h3 {
  color: #6f6f6f;
}
.mc-tool .mc-results h4 {
  color: #008ccc;
  font-size: 15px;
}
.mc-tool .mc-results p {
  font-size: 12px;
  color: #6f6f6f;
}
.mc-tool .mc-footer {
  overflow: hidden;
  clear: both;
  background: #ffffff;
  z-index: 1;
  position: relative;
}
.mc-tool .mc-footer p {
  font-size: 11px;
  color: #959595;
}
.mc-tool .mc-footer p.copyright {
  border-top: 1px solid #d9d9d9;
  padding: 8px 0;
  margin: 0px 3px 10px;
}
.mc-tool .mc-footer p.privacy {
  margin: 0px 3px 10px;
}
.mc-tool .disclaimer {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  clear: both;
  background: #fffbe1;
  padding: 10px 12px;
  margin-bottom: 20px;
  border-radius: 5px;
}
.mc-tool .disclaimer p {
  font-size: 12px;
  color: #b35d08;
  margin: 0;
}
.mc-tool .error {
  z-index: 1000;
  cursor: pointer;
  min-width: 151px;
  display: none;
  position: absolute;
  left: 35px;
  text-align: left;
  line-height: 1.25;
  bottom: 120%;
  background: #f47d20;
  color: #ffffff;
  font-size: 12px;
  font-weight: normal;
  padding: 8px 10px;
}
.mc-tool .error:after {
  content: '';
  display: block;
  position: absolute;
  top: 100%;
  border-left: 13px solid #f47d20;
  border-bottom: 14px solid transparent;
}
.mc-tool .button {
  color: #ffffff;
  font-size: 16px;
  line-height: 1;
  border: none;
  background: #008ccc;
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
}
.mc-tool .button:hover {
  background-color: rgba(0, 140, 204, 0.75);
}
.mc-tool .button:focus {
  background-color: rgba(0, 140, 204, 0.75);
}
.mc-tool .button:focus {
  outline: none;
}
.mc-tool .clear {
  display: block;
  clear: both;
  overflow: hidden;
}
.mc-tool a {
  color: inherit;
}
.mc-tool ::-webkit-input-placeholder {
  font-size: 14px;
  color: #54585a;
}
.mc-tool :-moz-placeholder {
  font-size: 14px;
  color: #54585a;
}
.mc-tool ::-moz-placeholder {
  font-size: 14px;
  color: #54585a;
}
.mc-tool :-ms-input-placeholder {
  font-size: 14px;
  color: #54585a;
}
#pregnancyDueDate.mc-tool {
  background: #ffffff;
  position: relative;
}
#pregnancyDueDate.mc-tool .wrapper {
  min-height: 305px;
  width: 100%;
  position: relative;
}
#pregnancyDueDate.mc-tool .wrapper:after,
#pregnancyDueDate.mc-tool .wrapper:before {
  content: '';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
  clear: both;
  float: none;
}
#pregnancyDueDate.mc-tool .mc-entry,
#pregnancyDueDate.mc-tool .mc-results {
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  position: absolute;
  transition: left 1s ease-in-out, opacity 1s ease;
  -webkit-transition: left 1s ease-in-out, opacity 1s ease;
  -moz-transition: left 1s ease-in-out, opacity 1s ease;
  -o-transition: left 1s ease-in-out, opacity 1s ease;
  opacity: 0;
  left: 100%;
}
#pregnancyDueDate.mc-tool .mc-entry.prevset,
#pregnancyDueDate.mc-tool .mc-results.prevset {
  left: -100%;
}
#pregnancyDueDate.mc-tool .mc-entry.active,
#pregnancyDueDate.mc-tool .mc-results.active {
  transition: left 1s ease-in-out 1s, opacity 1s ease 1s;
  -webkit-transition: left 1s ease-in-out 1s, opacity 1s ease 1s;
  -moz-transition: left 1s ease-in-out 1s, opacity 1s ease 1s;
  -o-transition: left 1s ease-in-out 1s, opacity 1s ease 1s;
  position: relative;
  left: 0;
  opacity: 1;
}
#pregnancyDueDate.mc-tool .mc-header {
  position: absolute;
  top: 0px;
  left: 0px;
  overflow: hidden;
}
#pregnancyDueDate.mc-tool .mc-header h2 {
  margin-right: 100px;
}
#pregnancyDueDate.mc-tool .mc-entry {
  background: url("/~/media/KCMS/GBS/Interactive Tools/Images/Pregnancy/pregnancyduedate/pregnancy-1.ashx") no-repeat right bottom;
  padding-top: 105px;
  padding-bottom: 35px;
}
#pregnancyDueDate.mc-tool .mc-entry p {
  width: 52%;
}
#pregnancyDueDate.mc-tool .mc-entry form {
  overflow: hidden;
}
#pregnancyDueDate.mc-tool .mc-entry label {
  width: 50%;
  position: relative;
}
#pregnancyDueDate.mc-tool .mc-entry .input {
  font-size: 15px;
  line-height: 15px;
  width: 98px;
  height: 35px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
}
#pregnancyDueDate.mc-tool .mc-entry .ui-datepicker-trigger {
  float: left;
  margin: 8px 17px;
  cursor: pointer;
  border: none;
  padding: 0;
  background-color: #fff;
}
#pregnancyDueDate.mc-tool .mc-entry .button {
  float: left;
  height: 35px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#pregnancyDueDate.mc-tool .mc-results {
  z-index: 0;
  background: url("/~/media/KCMS/GBS/Interactive Tools/Images/Pregnancy/pregnancyduedate/pregnancy-2.ashx") no-repeat 93% bottom;
  padding-top: 105px;
  margin: 0 0 -100%;
  transition: left 1s ease-in-out, margin 1s ease-in-out, opacity 1.5s ease;
  -webkit-transition: left 1s ease-in-out, margin 1s ease-in-out, opacity 1.5s ease;
  -moz-transition: left 1s ease-in-out, margin 1s ease-in-out, opacity 1.5s ease;
  -o-transition: left 1s ease-in-out, margin 1s ease-in-out, opacity 1.5s ease;
}
#pregnancyDueDate.mc-tool .mc-results.active {
  transition: left 1s ease-in-out 1s, margin 2s ease-in-out, opacity 1.5s ease 1s;
  -webkit-transition: left 1s ease-in-out 1s, margin 2s ease-in-out, opacity 1.5s ease 1s;
  -moz-transition: left 1s ease-in-out 1s, margin 2s ease-in-out, opacity 1.5s ease 1s;
  -o-transition: left 1s ease-in-out 1s, margin 2s ease-in-out, opacity 1.5s ease 1s;
  margin: 0;
}
#pregnancyDueDate.mc-tool .mc-results.active .info {
  opacity: 1;
  transition: opacity 2s ease;
  -webkit-transition: opacity 2s ease;
  -moz-transition: opacity 2s ease;
  -o-transition: opacity 2s ease;
}
#pregnancyDueDate.mc-tool .mc-results h3 {
  font-weight: bold;
}
#pregnancyDueDate.mc-tool .mc-results h3 span.result {
  display: block;
  padding-top: 10px;
  color: #008ccc;
  font-size: 24px;
  font-weight: normal;
}
#pregnancyDueDate.mc-tool .mc-results .info {
  overflow: hidden;
  margin: 8px 180px 23px 0 ;
  opacity: 0;
  background: #f5f5f3;
  padding: 12px 15px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  transition: opacity 0.5s ease;
  -webkit-transition: opacity 0.5s ease;
  -moz-transition: opacity 0.5s ease;
  -o-transition: opacity 0.5s ease;
}
#pregnancyDueDate.mc-tool .mc-results .info h4 {
  margin-bottom: 10px;
}
#pregnancyDueDate.mc-tool .error {
  bottom: -4px;
  left: 0px;
  min-width: 0;
}
@media only screen and (max-width: 450px) {
  .mc-tool {
    width: 100%;
    max-width: 320px;
    margin-left: 0px;
    margin-right: 0px;
  }
  #pregnancyDueDate.mc-tool .mc-header h2 {
    margin-right: 0;
  }
  #pregnancyDueDate.mc-tool .mc-entry {
    background: none;
  }
  #pregnancyDueDate.mc-tool .mc-entry p {
    width: 100%;
  }
  #pregnancyDueDate.mc-tool .mc-entry label {
    width: 100%;
  }
  #pregnancyDueDate.mc-tool .mc-results {
    background: none;
  }
  #pregnancyDueDate.mc-tool .mc-results .info {
    width: 100%;
  }
}
