@font-face {
  font-family: 'Din Next';
  font-style: normal;
  font-weight: 400;
  src: local("Din Next Regular"), local("Din-Next-Regular"), url("fonts/din-next-regular.woff2") format("woff2");
}
@font-face {
  font-family: 'Din Next';
  font-style: normal;
  font-weight: 600;
  src: local("Din Next Medium"), local("Din-Next-Medium"), url("fonts/din-next-medium.woff2") format("woff2");
}
@font-face {
  font-family: 'Din Next';
  font-style: normal;
  font-weight: 800;
  src: local("Din Next Bold"), local("Din-Next-Bold"), url("fonts/din-next-bold.woff2") format("woff2");
}
@font-face {
  font-family: 'Nandos Hand';
  font-style: normal;
  font-weight: 800;
  src: local("Nandos Hand"), local("Nandos-Hand"), url("fonts/nandos-hand.woff2") format("woff2");
}
html {
  background-color: #E5E5E5;
  margin: 0;
  padding: 0;
}
#overlay {
  display: inline-block;
  position: relative;
  top: -20px;
  left: 120px;
  z-index: 1000;
  /*border: 1px solid #ccc;*/
}
.page {
  margin: 0 auto;
  min-width: 1024px;
  /*border: 1px solid #96C31E ;*/
  padding: 5px;
  border-radius: 5px;
}
.pageTwo {
  margin: 0 auto;
  max-width: 1024px;
  border: 1px solid #96C31E;
  padding: 5px;
  border-radius: 5px;
}
body {
  background-color: #E5E5E5;
  color: #000000;
  font-size: 14px;
  font-family: "Din Next", Helvetica, Geneva, Arial, sans-serif;
  margin: 0;
  padding: 0;
}
a {
  outline: none;
  text-decoration: none;
  font-weight: bold;
  color: #00ADEF;
  padding: 4px;
}
a:link,
a:visited,
a:active,
a:hover {
  color: #00ADEF;
}
a:hover {
  text-decoration: underline;
  color: #00ADEF;
}
header,
footer,
hgroup,
nav,
section {
  display: block;
}
mark {
  background-color: #a6dbed;
  padding-left: 5px;
  padding-right: 5px;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.clear-fix:after {
  content: ".";
  clear: both;
  display: block;
  height: 0;
  visibility: hidden;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-bottom: 0;
  margin-top: 0;
  padding-top: 2px;
  padding-bottom: 0;
  font-weight: bold;
}
h1 {
  font-size: 34px;
  color: #FFFFFF;
  font-family: 'Nandos Hand', sans-serif;
}
h2 {
  font-size: 1.75em;
}
h3 {
  font-size: 21px;
  letter-spacing: -0.02em;
  color: #000;
}
h4 {
  font-size: 1.1em;
}
h5,
h6 {
  font-size: 1em;
  padding: 0;
  margin: 0;
}
h5 a:link,
h5 a:visited,
h5 a:active {
  padding: 0;
  text-decoration: none;
}
p {
  color: #212529;
  font-size: 14px;
}
.logo {
  left: 3rem;
  top: 27px;
}
.login-content-wrapper {
  margin: 0 auto;
  max-width: 1024px;
  width: auto;
}
.marginright {
  margin-right: 10px;
}
.login-wrapper {
  /*border: 1px #b3b4b5 solid;*/
  border-radius: 5px;
  min-height: 299px;
  background: rgba(255, 255, 255, 0.9) no-repeat left center;
  width: 800px;
}
.login-wrapper .form {
  padding: 50px 30px 0 0;
  width: 414px;
}
.login-wrapper .form li {
  padding-bottom: 15px;
  list-style: none;
}
.login-wrapper .form li .logintextbox {
  resize: none;
  height: 41px;
  width: 641px;
  border-radius: 5px;
  border: 1px #e8e8e8 solid;
  background: #F1F2F5 no-repeat 10px center !important;
  margin: 0;
  display: block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 20px 0 45px;
  font-size: 14px;
  font-family: Arial, sans-serif;
  color: #000000;
}
.no-boxsizing .logintextbox {
  width: 349px !important;
}
.login-wrapper .form li .logintextbox.email-icon {
  background-image: url("../Images/Icons/email.png") !important;
}
.login-wrapper .form li .logintextbox.password-icon {
  background-image: url("../Images/Icons/key.png") !important;
}
.login-wrapper .form li.two-items {
  padding: 20px 0 30px 0;
}
.login-wrapper .form li input[type=checkbox] {
  display: inline-block !important;
  vertical-align: middle;
}
.login-wrapper .form li label {
  background: none;
  vertical-align: middle;
  display: inline-block;
  height: auto;
  line-height: 1;
  padding: 0;
  font-size: 0.875em;
  color: #515151;
  padding-left: 5px;
}
.login-wrapper .form li a {
  font-size: 0.875em;
  text-decoration: none;
  line-height: 16px;
}
.login-wrapper .form li .logintextbox::-webkit-input-placeholder {
  color: #cfcfcf !important;
}
.login-wrapper .form li .logintextbox:-moz-placeholder {
  /* Firefox 18- */
  color: #cfcfcf !important;
}
.login-wrapper .form li .logintextbox::-moz-placeholder {
  /* Firefox 19+ */
  color: #cfcfcf !important;
}
.login-wrapper .form li .logintextbox:-ms-input-placeholder {
  color: #cfcfcf !important;
}
.logintextbox {
  border: none;
  color: #c53446;
  height: 46px;
  line-height: 46px;
  outline: none;
  background: #F1F2F5;
  margin-left: 25px;
}
/* main layout
----------------------------------------------------------*/
.SurveyBanner {
  margin: 0 auto;
  max-width: 1024px;
  width: auto;
  background-image: url(../Images/surveybanner.png);
  background-repeat: no-repeat;
  height: 112px;
}
.content-wrapper {
  margin: 0 auto;
  max-width: 1024px;
  width: auto;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
#body {
  background-color: #fff;
  clear: both;
  max-width: 1024px;
}
footer {
  background-color: #000;
  text-align: center;
}
footer p {
  font-size: 14px;
}
footer p a:link {
  color: #ffffff;
  text-decoration: none;
}
footer p a:link:hover {
  text-decoration: underline;
}
.left-column {
  width: 150px;
  height: 100%;
  float: left;
  background: #00a8c8;
}
.textbox {
  border: 1px solid #b7b7b7;
  line-height: 1.5;
  height: 35px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 7px;
  border-radius: 5px;
  background: #ffffff;
  color: #333333;
  vertical-align: middle;
  font-family: "Din Next", Helvetica, Geneva, Arial, sans-serif;
  display: block;
  resize: none;
  font-size: 16px;
}
.textboxRadio {
  border: 1px solid #b7b7b7;
  line-height: 1.5;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 7px;
  border-radius: 5px;
  background: #ffffff;
  color: #333333;
  vertical-align: middle;
  font-family: Century Gothic;
  display: block;
  height: 100px;
  resize: none;
}
.ddl {
  border: 1px solid #b7b7b7;
  height: 30px;
  line-height: 30px;
  outline: none;
  background: #fff;
  border-radius: 4px;
  padding-left: 5px;
  max-width: 190px;
  width: 100%;
  margin-left: 20px;
}
.buttonselection {
  display: flex;
  justify-content: space-between;
  margin: 3rem -1rem 0;
}
.Homebtn {
  height: 45px;
  text-align: center;
  line-height: 45px;
  background: #96C31E;
  border: #96C31E;
  border-radius: 3px;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  width: 200px;
  max-width: 50%;
  margin: 0 1rem;
}
.Backbtn {
  height: 45px;
  text-align: center;
  line-height: 45px;
  background: #00A5C8;
  border: #00A5C8;
  border-radius: 3px;
  color: #ffffff;
  font-size: 18px;
  font-weight: bold;
  width: 200px;
  margin: 0 1rem;
}
.Homebtn:hover,
.Backbtn:hover,
.Homebtn:active,
.Backbtn:active,
.Homebtn:visited,
.Backbtn:visited {
  opacity: 0.8;
}
/*.Homebtn:hover {
  background: #ffffff;
  color: #96C31E;
  border: 1px solid #96C31E;
}*/
.btn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #96C31E;
  border: #96C31E;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.btn:hover {
  background: #ffffff;
  color: #96C31E;
  border: 1px solid #96C31E;
}
.brolinkbtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #204099;
  border: #204099;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.brolinkbtn:hover {
  background: #ffffff;
  color: #204099;
  border: 1px solid #204099;
}
.echelonbtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #08044b;
  border: #08044b;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.echelonbtn:hover {
  background: #ffffff;
  color: #08044b;
  border: 1px solid #08044b;
}
.emeraldbtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #4fa627;
  border: #4fa627;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.emeraldbtn:hover {
  background: #ffffff;
  color: #4fa627;
  border: 1px solid #4fa627;
}
.hlbtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #e12f2d;
  border: #e12f2d;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.hlbtn:hover {
  background: #ffffff;
  color: #e12f2d;
  border: 1px solid #e12f2d;
}
.mirabilisbtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #928a25;
  border: #928a25;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.mirabilisbtn:hover {
  background: #ffffff;
  color: #928a25;
  border: 1px solid #928a25;
}
.miwaybtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #e0004e;
  border: #e0004e;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.miwaybtn:hover {
  background: #ffffff;
  color: #e0004e;
  border: 1px solid #e0004e;
}
.santambtn {
  min-width: 140px;
  height: 45px;
  text-align: center;
  line-height: 45px;
  padding: 0 1px;
  background: #96C31E;
  border: #96C31E;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
}
.santambtn:hover {
  background: #ffffff;
  color: #96C31E;
  border: 1px solid #96C31E;
}
.spancolumn {
  width: 300px;
  text-align: left;
  font-weight: bold;
  display: inline-block;
}
.center {
  text-align: center;
  width: 100%;
}
.left {
  float: left;
}
.right {
  float: right;
}
.full {
  width: 100%;
  display: block;
}
.short {
  width: 20%;
  display: inline-block;
}
.dashboard-wrapper {
  border: 1px #cfcfcf solid;
  border-radius: 8px;
  padding: 30px 0 20px;
  border-top-left-radius: 0;
}
.marginright {
  margin-right: 10px;
}
.alert {
  position: fixed;
  z-index: 100;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /*  top: 25%;*/
  left: 50%;
  -webkit-transform: translate(-50%, 10%);
  transform: translate(-50%, 10%);
}
.assessment-progress {
  width: 30%;
  margin: 0 0 0 auto;
}
.assessment-progress .ui-progressbar {
  border-radius: 0;
  height: 18px !important;
  border: 1px #96C31E solid;
  background: #ffffff;
}
.assessment-progress .ui-progressbar-value {
  background: #96C31E;
  height: 17px !important;
  padding-top: 0.2px;
}
.assessment-progress .progress-label {
  font-size: 0.875em;
  color: #333333;
  font-weight: bold;
  padding: 4px 0 0 0;
  margin: 0 auto;
}
.Terms {
  padding-left: 250px;
}
.rbscore {
  float: right;
}
@media all and (max-width: 770px) {
  .rbscore {
    text-align: left;
    display: block;
    padding: 0;
    margin: 0;
  }
  .rbcontainer {
    width: 150px;
    text-align: left;
  }
  .Terms {
    padding-left: 0;
  }
  .float-left {
    text-align: center;
    display: block;
    float: none;
  }
  .float-right {
    text-align: center;
    display: block;
    float: none;
  }
  .short {
    width: 100%;
    display: block;
  }
}
@media all and (max-width: 400px) {
  .rbscore {
    text-align: left;
    display: block;
    padding: 0;
    margin: 0;
  }
  .rbcontainer {
    width: 150px;
    text-align: left;
  }
  .Terms {
    padding-left: 0;
  }
}
.dashLink {
  min-width: 140px;
  text-align: center;
  padding: 14px;
  background: #96C31E;
  border: #96C31E;
  border-radius: 3px;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: normal;
  cursor: pointer;
  color: white !important;
  text-decoration: none !important;
}
.dashheader {
  margin: 0 auto;
  max-width: 1024px;
  height: 46px;
  left: 64px;
  top: 123px;
  background: #96C31E;
}
.page-dashboard {
  margin: 0 auto;
  /*min-width: 1024px;*/
  border: 1px solid #00a651;
  padding: 5px;
  border-radius: 5px;
  width: 1024px;
  max-width: 100%;
  overflow-x: hidden;
}
.page-dashboard .management-index {
  display: flex;
}
@media (max-width: 768px) {
  .page-dashboard .management-index {
    flex-direction: column;
  }
}
.page-dashboard .left-index-column {
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  width: 100%;
}
@media (max-width: 768px) {
  .page-dashboard .left-index-column {
    border: none;
  }
}
.page-dashboard .right-index-column {
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  width: 100%;
}
@media (max-width: 768px) {
  .page-dashboard .right-index-column {
    border: none;
  }
}
.page-dashboard .report-header {
  width: 1024px;
  max-width: 100%;
}
.page-dashboard .report-header .header-one {
  padding-left: 40px;
}
@media (max-width: 768px) {
  .page-dashboard .report-header .header-one {
    padding: 10px;
  }
}
.page-dashboard .report-header .header-two {
  padding-left: 40px;
  padding-top: 5px;
  padding-bottom: 10px;
}
@media (max-width: 768px) {
  .page-dashboard .report-header .header-two {
    padding: 10px;
  }
}
.page-dashboard .image-resposive-container {
  width: 450px;
  margin-top: 0px;
  margin-bottom: 30px;
  text-align: left;
  margin-left: 20px;
}
@media (max-width: 768px) {
  .page-dashboard .image-resposive-container {
    width: 100%;
    margin-left: 0;
  }
  .page-dashboard .image-resposive-container td {
    padding: 0 10px !important;
  }
}
.page-dashboard .image-mobile {
  width: 850px;
}
@media (max-width: 768px) {
  .page-dashboard .image-mobile {
    margin: 20px 0;
    width: 100%;
  }
}
.image-header {
  margin: 0 auto;
  padding-left: 0px;
  width: 1024px;
  max-width: 100%;
}
.index-content {
  width: 100%;
  padding-left: 40px;
}
@media (max-width: 768px) {
  .index-content {
    padding-left: 0;
  }
}
.index-content .elements {
  display: flex;
  /*justify-content: space-between;*/
  align-items: center;
  width: 44.9%;
}
.index-content .elements .red,
.index-content .elements .orange,
.index-content .elements .dark-green {
  padding-right: 1px;
}
.EngagementTopBottom {
  width: 450px;
  margin-top: 0px;
  margin-bottom: 30px;
  text-align: left;
  margin-left: 20px;
}
@media (max-width: 768px) {
  .EngagementTopBottom {
    margin-left: 5px;
  }
}
@media (max-width: 768px) {
  .center-align {
    float: none !important;
  }
}
.padding-left {
  padding-left: 50px;
}
@media (max-width: 768px) {
  .padding-left {
    padding-left: 0;
  }
}
.landing-page-hieght {
  min-height: 669px;
  margin-top: 46px;
}
/*//================Survey=================//*/
@media all and (max-width: 600px) {
  .buttonselection {
    text-align: center !important;
    padding-left: 0px !important;
  }
  /*   .full {

        width: 80%;
        display: block;
    }*/
  .langdiv {
    width: 100%;
    text-align: center;
  }
  .progressdiv {
    width: 100%;
    text-align: center;
  }
  .ddl {
    border: 1px solid #b7b7b7;
    height: 30px;
    line-height: 30px;
    outline: none;
    background: #fff;
    border-radius: 4px;
    padding-left: 5px;
  }
  .progress {
    position: relative;
    border: 1px solid white;
    padding: 1px;
    margin-right: 20px;
    background: none !important;
    border-radius: 100px !important;
  }
  #survey {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  #survey label {
    width: 100%;
    max-width: none !important;
    height: 62px;
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #D0D0D0;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 0px;
  }
  #survey label span.radiocontainer {
    text-align: center;
    font-size: 14px;
    padding: 20px 5px;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    height: 100%;
    width: 100%;
  }
  #survey label img {
    display: none;
  }
  #survey label input {
    background-color: white;
    color: white;
    display: none;
  }
  #survey input:checked + span.radiocontainer {
    background-color: #32AACD;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  #survey input:checked + span.radiocontainer > .radiotext {
    display: none;
  }
  #survey input:checked + span.radiocontainer > img {
    display: block;
    height: auto;
    max-height: 50px;
    position: relative;
    -webkit-align-self: center;
    align-self: center;
    text-align: center;
    padding: 2px 0;
  }
  /*============Yes or No Lables==============*/
  #yesno {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    width: 100%;
  }
  #yesno label {
    width: 300px;
    height: 62px;
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #D0D0D0;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 0px;
  }
  #yesno label span.radiocontainer {
    text-align: center;
    font-size: 14px;
    padding: 20px 5px;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    height: 100%;
    width: 100%;
  }
  #yesno label input {
    background-color: white;
    color: white;
    display: none;
  }
  #yesno input:checked + span.radiocontainer {
    background-color: #32AACD;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  /*============Multi Lables==============*/
  #multi {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    width: 100%;
  }
  #multi label {
    width: 100%;
    height: 120px !important;
    background-color: #fff;
    border-radius: 0;
    border: 1px solid #D0D0D0;
    cursor: pointer;
    display: inline-block;
    margin-bottom: 0px;
  }
  #multi label span.radiocontainer {
    text-align: center;
    font-size: 14px;
    padding: 20px 5px;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    height: 100%;
    width: 100%;
  }
  #multi label input {
    background-color: white;
    color: white;
    display: none;
  }
  #multi input:checked + span.radiocontainer {
    background-color: #32AACD;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  /*=============NPS===========*/
  #nps {
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    width: 100%;
  }
  /*#nps label {
        width: 300px !important;
        height: 62px;
        background-color: #fff;
        border-radius: 0;
        border: 1px solid #D0D0D0;
        margin-left: 0px;
        cursor: pointer;
        display: inline-block;
        margin-bottom: 0px;
    }*/
  #nps label.low {
    background: rgba(206, 10, 36, 0.4);
  }
  #nps label.medium {
    background: rgba(250, 165, 0, 0.4);
  }
  #nps label.high {
    background: rgba(150, 195, 30, 0.4);
  }
  #nps label span.radiocontainer {
    text-align: center;
    font-size: 14px;
    padding: 20px 5px;
    display: -webkit-box;
    /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;
    /* TWEENER - IE 10 */
    display: -webkit-flex;
    /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    height: 100%;
    width: 100%;
  }
  #nps label img {
    display: none;
  }
  #nps label input {
    background-color: white;
    color: white;
    display: none;
  }
  #nps label.low input:checked + span.radiocontainer {
    background: #CE0A24;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  #nps label.medium input:checked + span.radiocontainer {
    background: #FFA800;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  #nps label.high input:checked + span.radiocontainer {
    background: #96C31E;
    color: white;
    /*padding: 5px 0 6px 0;*/
  }
  #nps input:checked + span.radiocontainer > .radiotext {
    display: none;
  }
  #nps input:checked + span.radiocontainer > img {
    display: block;
    height: auto;
    max-height: 50px;
    position: relative;
    -webkit-align-self: center;
    align-self: center;
    text-align: center;
    padding: 2px 0;
  }
}
#survey {
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  width: 100%;
}
#survey label {
  background-color: #fff;
  border-radius: 0;
  border: 1px solid #D0D0D0;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 0px;
  flex: 1 1 0;
  height: 90px;
}
#survey label span.radiocontainer {
  text-align: center;
  font-size: 14px;
  padding: 20px 5px;
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  height: 100%;
  width: 100%;
}
#survey label img {
  display: none;
}
#survey label input {
  background-color: white;
  color: white;
  display: none;
}
#survey input:checked + span.radiocontainer {
  background-color: #32AACD;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
#survey input:checked + span.radiocontainer > .radiotext {
  display: none;
}
#survey input:checked + span.radiocontainer > img {
  display: block;
  height: auto;
  max-height: 50px;
  position: relative;
  -webkit-align-self: center;
  align-self: center;
  text-align: center;
  padding: 2px 0;
}
/*============Yes or No Lables==============*/
#yesno {
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  width: 100%;
}
#yesno label {
  width: 193px;
  height: 62px;
  background-color: #fff;
  border-radius: 0;
  border: 1px solid #D0D0D0;
  margin-left: -4px;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 0px;
}
#yesno label span.radiocontainer {
  text-align: center;
  font-size: 14px;
  padding: 20px 5px;
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  height: 100%;
  width: 100%;
}
#yesno label input {
  background-color: white;
  color: white;
  display: none;
}
#yesno input:checked + span.radiocontainer {
  background-color: #32AACD;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
/*============Multi Lables==============*/
#multi {
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  width: 100%;
}
#multi label {
  width: 100%;
  height: 62px;
  background-color: #fff;
  border-radius: 0;
  border: 1px solid #D0D0D0;
  margin-left: -4px;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 0px;
}
#multi label span.radiocontainer {
  text-align: center;
  font-size: 14px;
  padding: 20px 5px;
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  height: 100%;
  width: 100%;
}
#multi label input {
  background-color: white;
  color: white;
  display: none;
}
#multi input:checked + span.radiocontainer {
  background-color: #32AACD;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
/*=============NPS===========*/
#nps {
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  width: 100%;
}
#nps label {
  width: auto;
  height: 62px;
  border-radius: 0;
  border: 1px solid #D0D0D0;
  margin-left: 0px;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 0px;
  flex: 1 1 0px;
}
#nps label.low {
  background: rgba(206, 10, 36, 0.4);
}
#nps label.medium {
  background: rgba(250, 165, 0, 0.4);
}
#nps label.high {
  background: rgba(150, 195, 30, 0.4);
}
#nps label span.radiocontainer {
  text-align: center;
  font-size: 14px;
  padding: 20px 5px;
  display: -webkit-box;
  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
  display: -ms-flexbox;
  /* TWEENER - IE 10 */
  display: -webkit-flex;
  /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  height: 100%;
  width: 100%;
}
#nps label img {
  display: none;
}
#nps label input {
  background-color: white;
  color: white;
  display: none;
}
#nps label.low input:checked + span.radiocontainer {
  background: #CE0A24;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
#nps label.medium input:checked + span.radiocontainer {
  background: #FFA800;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
#nps label.high input:checked + span.radiocontainer {
  background: #96C31E;
  color: white;
  /*padding: 5px 0 6px 0;*/
}
#nps input:checked + span.radiocontainer > .radiotext {
  display: none;
}
#nps input:checked + span.radiocontainer > img {
  display: block;
  height: auto;
  max-height: 50px;
  position: relative;
  -webkit-align-self: center;
  align-self: center;
  text-align: center;
  padding: 2px 0;
}
/*========NPS Table======*/
.listtable {
  width: 100%;
}
.listtable th {
  border: 1px solid white;
  color: white;
  font-weight: bold;
  background: #005288;
  padding: 10px;
  font-family: "Din Next", Helvetica, Geneva, Arial, sans-serif;
}
.listtable th.alt {
  border: 1px solid white;
  color: white;
  font-weight: bold;
  background: #0087B4;
  padding: 10px;
  font-family: "Din Next", Helvetica, Geneva, Arial, sans-serif;
}
.listtable > tbody td {
  padding: 10px;
  border: 1px solid #005288;
}
.listtable > tbody td.alt {
  padding: 10px;
  border: 1px solid #0087B4;
}
.listtable > tbody td a {
  color: #005288;
  font-weight: bold;
}
.listtable > tfoot td {
  padding: 0;
}
.listtable > tfoot .center {
  text-align: center;
}
.listtable.nps {
  margin-bottom: 2rem;
}
.listtable.nps th,
.listtable.nps td {
  display: table-cell !important;
  clear: none !important;
  float: none !important;
  width: auto !important;
}
.listtable.nps tr td:first-child,
.listtable.nps tr th:first-child {
  text-align: center !important;
}
.listtable.nps > tbody td.alt {
  padding: 10px 20px !important;
  border: 1px solid #DCDDDE;
}
.listtable.nps tr:first-child th {
  padding: 10px 20px;
  font-size: 15px;
}
.cirletick {
  background: #8DC63F;
  border-radius: 40px;
  width: 80px;
  height: 80px;
  line-height: 80px;
  text-align: center;
  color: white;
  font-weight: bold;
  font-size: 16px;
  margin: 40px auto 0;
}
::-webkit-input-placeholder {
  font-style: italic;
  font-size: 14px;
}
:-moz-placeholder {
  font-style: italic;
  font-size: 14px;
}
::-moz-placeholder {
  font-style: italic;
  font-size: 14px;
}
:-ms-input-placeholder {
  font-style: italic;
  font-size: 14px;
}
.progress-label {
  color: white;
  min-width: 95px;
}
.mw-25 {
  width: 100% !important;
  max-width: 25% !important;
}
.w-md-25 {
  width: 25%;
}
.w-md-50 {
  width: 50%;
}
.w-md-75 {
  width: 75%;
}
@media (max-width: 1024px) {
  #body {
    max-width: 96% !important;
  }
}
@media (max-width: 768px) {
  #yesno {
    flex-wrap: wrap;
  }
  .mw-25 {
    width: 100% !important;
    max-width: none !important;
  }
  .w-md-25 {
    width: 100% !important;
  }
  .w-md-75 {
    width: 100% !important;
  }
  .w-md-50 {
    width: 100% !important;
  }
  .langdiv {
    order: 1;
  }
  .progressdiv {
    order: 2;
  }
  .ddl {
    width: 100%;
    max-width: none;
    margin-bottom: 10px;
    margin-left: 0;
  }
  .listtable.nps > tbody td.alt {
    padding: 10px !important;
  }
  #nps,
  #survey {
    flex-wrap: wrap;
  }
  #nps label,
  #survey label {
    flex: 1 100%;
  }
  .strip-padding tr .p-0 .alternate {
    margin: 0 -3rem;
    padding: 0 3rem;
  }
  .strip-padding tr:nth-of-type(odd) .p-0 .alternate {
    background: #f4f5f5;
  }
}
@media (max-width: 576px) {
  .strip-padding tr .p-0 .alternate {
    margin: 0 -1.5rem;
    padding: 0 1.5rem;
  }
  .strip-padding tr:nth-of-type(odd) .p-0 .alternate {
    background: #f4f5f5;
  }
  .Homebtn {
    max-width: none;
    width: 100%;
  }
}
@media (max-width: 400px) {
  .progressdiv {
    flex-wrap: wrap;
  }
  .progressdiv .progress-label {
    min-width: 100%;
  }
}
.strip-padding td {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.overlay {
  position: fixed;
  z-index: 999;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-color: Black;
  filter: alpha(opacity=80);
  opacity: 0.8;
}
.overlayContent {
  z-index: 1000;
  margin: 300px auto;
  padding: 10px;
  width: 300px;
  background-color: White;
  border-radius: 10px;
  text-align: center;
}
.overlayContent img {
  height: 128px;
  width: 128px;
  margin: 0 auto;
  text-align: center;
}