/* Prodcution */

/* ----------------- survey css START ----------------------------------------- */



@media (max-width: 980px) {}

.spanish-text {
  font-style: italic;
  color: #0f6eb6;
  /* asteri main blue */
}

#the_survey_div a {
  color: #24b8e4 !important;
}

@media (max-width: 980px) {
  .ratings_page_image {
    padding-right: 0px;
    padding-bottom: 10px !important;
    margin-top: 50px;
  }

  .row:first-of-type .ratings_page_image {
    margin-top: 0px;
  }

  .survey-ratings-page-text+div .row p {
    text-align: center;
  }

  .survey-header {
    padding-bottom: 0px !important;
    z-index: 999;
  }

  .survey-header .et_pb_row_1.et_pb_row {
    padding-bottom: 25px !important;
  }

  .survey-header .et_pb_row_0,
  .lc-logo,
  .otrio-logo,
  .client-logo,
  .square-client-logo {
    overflow: visible !important;


  }

  .square-client-logo img {
    width: 80px !important;
    margin-top: 0px;
  }

  .otrio-logo img,
  .otrio-logo img,
  .client-logo img {
    width: 150px !important;
    margin-top: 0px;
  }

  .asteri-logo img {
    width: 80px !important;
    top: 16px;
    right: 19px;
    background: #DE554A;
    padding: 10px;
  }

  .asteri-logo {
    position: relative !important;
    top: -45px !important;
    width: auto;
  }

  .progress-bar progress {
    width: 100%;
  }

  #header_text_div .et_pb_column_1_4 {
    display: none;
  }

  #header_p_text {
    line-height: 1em !important;
    font-size: 14px !important;
  }

  .content-row p {
    line-height: 1em !important;
    font-size: 16px !important;
  }

  .content-row button,
  .content-row button:hover {
    min-width: 100% !important;
  }
}

#start {
  z-index: 1;
}

.image-view .survey-title {
  display: none;
}

.image {
  margin-top: 10px;
}

.image img {
  margin: 0 auto;
  display: block;
  width: 80%;
}

.survey-image-text {
  text-align: center;
  margin-top: 15px;
}

.ratings_page_image {
  max-width: 100% !important;
  padding-right: 50px;
  padding-bottom: 30px;
}

.image-view .intro-survey-title,
.image-view .intro-main-text,
.image-view .content-row h2,
.image-view .survey-title,
.image-view .survey-page-title,
.video-view .intro-survey-title,
.video-view .intro-main-text,
.video-view .content-row h2,
.video-view .survey-title,
.video-view .survey-page-title {
  padding-bottom: 0;
  text-align: center;
}

.image-view .progress-bar,
.video-view .progress-bar {
  margin: 10px auto !important;
  width: 40%;
}

.progress-bar {
  margin: 10px 0 !important;
}

.progress-bar progress {
  width: 100%;
}

progress::-webkit-progress-value {
  background-color: rgba(247, 220, 74, 1) !important;
  /* asteri.io yellow */
  height: 100%;
  width: 50%;
  box-sizing: border-box;
  -webkit-user-modify: read-only !important;
}

progress::-webkit-progress-bar {
  background-color: grey;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  -webkit-user-modify: read-only !important;
}

progress::-webkit-progress-inner-element {
  box-sizing: inherit;
  -webkit-user-modify: read-only;
  height: 100%;
  width: 100%;
}

blockquote.survey {
  border-color: #FFD530;
  margin: 0;
  background: rgba(0, 0, 0, .6);
  padding: 15px;
}

blockquote.survey h1 {
  font-family: 'Open Sans', Helvetica, Arial, Lucida, sans-serif !important;
  text-transform: capitalize !important;
  font-size: 38px !important;
}

blockquote.survey p {
  font-family: 'Open Sans', Helvetica, Arial, Lucida, sans-serif !important;
  font-size: 20px !important;
  line-height: 1.3em !important;
  font-weight: 500 !important;
}

.content-row ul li p,
.content-row ul li {
  margin: 0 !important;
  margin-bottom: 0em !important;
}

.content-row p ul {
  padding: 0em 0 .3em 1.143em;
  margin-top: -10px;
}

.content-row p {
  font-family: 'Open Sans', Helvetica, Arial, Lucida, sans-serif !important;
  font-size: 22px;
  line-height: 1.3em !important;
  font-weight: 500 !important;
  margin-bottom: 0px
}

.emoji-container,
.section.group.questions {
  margin-bottom: 20px !important;
  margin-top: 15px !important;
}

.number-rating-2 {
  margin-top: 15px;
}

h1.yellow,
h2.yellow,
h3.yellow,
h4.yellow,
h5.yellow,
h6.yellow,
p.yellow,
.yellow h1,
.yellow h2,
.yellow h3,
.yellow h4,
.yellow h5,
.yellow h6,
.yellow p {
  color: rgba(247, 220, 74, 1) !important;
  /* asteri.io yellow */
}

.content-row h2,
h1.red,
h2.red,
h3.red,
h4.red,
h5.red,
h6.red,
p.red,
.red h1,
.red h2,
.red h3,
.red h4,
.red h5,
.red h6,
.red p {
  color: rgb(240, 72, 65, 1) !important
    /* asteri.io red */
}

.content-row h2 {
  font-family: 'Open Sans', Helvetica, Arial, Lucida, sans-serif !important;
  text-transform: capitalize !important;
  font-size: 30px !important;
  font-weight: 700 !important;
}

.content-row h2:after {
  content: "";
  display: block;
  position: relative !important;
  height: auto;
  padding: 5px;
  z-index: 999;
  font-size: 25px !Important;
  line-height: 1.1em !important;
  font-family: "Source Serif Pro", Georgia, "Times New Roman", serif;
  text-transform: capitalize;
  left: 0;
  text-align: left;
  width: 100%;
  border-bottom: 1px solid rgba(0, 0, 0, .1);
  box-sizing: border-box;
  margin-bottom: 20px;
}

.content-row h3 {
  font-size: 30px !important;
  text-transform: capitalize !important;
  font-weight: 700 !important;
}

#header_title_text {
  font-weight: bold !important;
  line-height: 1em;
  font-size: 40px !important;
  letter-spacing: 2px !important;
  text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4);
  color: #e3c351 !important;
}

.questions {
  margin-bottom: 50px;
}

.questions input {
  width: auto !important;
  float: left;
  margin-right: 10px;
  margin-top: 8px;
}

.questions label {
  font-size: 18px !important;
  line-height: 1.3em !important;
  font-weight: 500 !important;
}

.col.radio-button {
  width: auto;
  margin-right: 15px;
}

.content-row>div,
#the_survey_div {
  margin: 25px 0;
  margin-top: 3vw;
}

.wp-button,
.content-row button,
.content-row button.yellow {
  color: black !important;
  background-color: rgba(247, 220, 74, 1) !important;
  /* asteri.io yellow */
}

.wp-button:hover,
.content-row button:hover,
.content-row button.yellow:hover {
  cursor: pointer !important;
  color: #231F20 !important;
  /* asteri black */
  background-color: rgba(247, 220, 74, 0.8) !important;
  /* asteri.io yellow */
}

.content-row button.red {
  color: #000000 !important;
  background-color: rgb(240, 72, 65, 1) !important
    /* asteri.io red */
}

.content-row button.red:hover {
  color: #231F20 !important;
  /* asteri black */
  background-color: rgb(240, 72, 65, 0.5) !important
    /* asteri.io red */
}

.button {
  background-color: transparent !important
}

.image-view video,
.image-view .button,
.video-view video,
.video-view .button {
  margin: 0 auto;
  display: flex;
  padding: 0;
}

.image-view .button button,
.image-view .col button,
.video-view .button button,
.video-view .col button {
  margin-left: auto !important;
  margin-right: auto !important;
}

.image-view button,
.video-view button {
  float: none !important;
}

.image-view video,
.image-view .button .video-view video,
.video-view .button {
  margin: 0 auto;
  display: flex;
  padding: 0;
}

.wp-button,
.video-view .intro-main-text+.row>.col,
.image-view .intro-main-text+.row>.col {
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex;
  float: none !important;
}

.image-view .intro-survey-title,
.image-view .intro-main-text,
.video-view .intro-survey-title,
.video-view .intro-main-text {
  text-align: center;
}

.image-view .intro-survey-title:after,
.video-view .intro-survey-title:after {
  margin-bottom: 0px;
  padding: 0px;

}

.content-row button {
  float: left !important;
}

.wp-button,
.content-row button {
  cursor: pointer !important;
  padding: 1rem 1rem !important;
  font-size: 1.25rem !important;
  line-height: 1.5 !important;
  border-radius: .3rem !important;

  margin-top: 10px !important;
  margin: 20px 0 !important;
  text-transform: uppercase !important;
  letter-spacing: .1em;
  width: auto !important;
  min-width: 300px !important;
  text-align: center !important;
  display: block !important;
  z-index: 999 !important;
  -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.1) !important;
  box-shadow: inset 0 0 0.8rem 0.1rem rgba(0, 0, 0, 0.1), 0 10px 30px -10px rgba(0, 0, 0, 0.2) !important;
  text-shadow: 1px 1px 1px #fffadf, 0px 0px 2px rgb(99, 90, 47, 0.5);
}

.wp-button:hover,
.content-row button:hover {
  cursor: pointer !important;
  padding: 1rem 1rem !important;
  font-size: 1.25rem !important;
  line-height: 1.5 !important;
  border-radius: .3rem !important;

  text-transform: uppercase !important;
  letter-spacing: .1em;
  -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.1) !important;
  box-shadow: inset 0 0 0.8rem 0.5rem rgba(255, 255, 255, 0.3), 0 10px 30px -10px rgba(0, 0, 0, 0.4) !important;
}

@media (max-width: 980px) {

  .content-row button,
  .content-row button:hover {
    padding: 1rem 1rem !important;
  }

}

.survey-thanks-text+button {
  margin-bottom: 400px !important;
}

.content-row #entered_email_error {
  margin: 20px !important;
  display: inline-block;
}

.content-row input[type=password],
.content-row input[type=tel],
.content-row input[type=text],
.content-row input[type=file],
.content-row input[type=search],
.content-row input,
.content-row select,
.content-row textarea,
.content-row .input,
.content-row .textarea {
  background-color: #fbfafa;
  border: solid 1px #ededed;
  width: 100%;
  -moz-border-radius: 4px !important;
  -webkit-border-radius: 4px !important;
  border-radius: 4px !important;
  padding: 16px !important;
  margin-top: 7px;
  box-shadow: none;
  box-sizing: border-box;
  transition: .3s ease;
  font-size: 15px;
  color: #676767;
}

.content-row .input::placeholder,
.content-row .textarea::placeholder,
.content-row input::placeholder,
.content-row input[type=text]::placeholder,
.content-row input[type=password]::placeholder,
.content-row input[type=email]::placeholder,
.content-row input[type=search]::placeholder,
.content-row select::placeholder,
.content-row textarea::placeholder {
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: capitalize;
}

#next_info_text {
  margin-left: 15px;
}

@media (min-width: 981px) {
  .content-row {
    width: 65%;
  }
}

@media (max-width: 980px) {
  .content-row {
    width: 70%;
  }
}

@media (max-width: 980px) {

  .image-survey .image-view img,
  .image-survey .col img {
    width: 200px;
    margin: 10px auto;
  }
}

.image-survey #next_info_text {
  text-align: center;
  width: 100%;
  display: block;
  margin-left: 0px;
}


.image-survey .image-view img {
  width: 300px;
  margin: 10px auto;
  display: block;
}

.image-survey .col img {
  width: 300px;
  margin: 0 auto;
  display: block;
}

.image-survey #survey_next_page_button {
  margin: 10px auto !important;
  display: block !important;
  float: none !important;
}

.image-survey .progress-bar+h3,
.image-survey .progress-bar+h3+p,
.image-survey .col p {
  text-align: center !important;
  padding-bottom: 0;
}

.image-survey h2,
.image-survey .progress-bar+h3+p {
  display: none;
}

.image-survey h3+div {
  margin-top: 0 !important;
}

.image-view .star-ratings,
.video-view .star-ratings {
  align-items: left;
  text-align: left;
}

.star-ratings {
  width: auto;
  margin: 0 auto !important;
  align-items: center;
  text-align: center;
}

.dark-theme h3,
.dark-theme h4,
.dark-theme h5,
.dark-theme p,
.dark-theme span,
.dark-theme body,
.dark-theme #entered_email_error {
  color: white;
}

.dark-theme .progress-bar {
  background-color: #2a2b2f;
  box-shadow: inset 0 5px 15px rgba(0, 0, 0, 0.6);
  height: 20px;
  /*
        overflow: hidden;
    */
  padding: 0px 5px;
  border-radius: 5px;
  margin-bottom: 20px;
  margin-left: 0;
  animation-delay: 0.75s;
  -webkit-animation-delay: 0.75s;
}

.dark-theme .progress-bar progress {
  width: 100%;
  position: relative;
  top: -5px;
}

.dark-theme .progress-bar progress::-webkit-progress-value {
  background-image: linear-gradient(to bottom, #00c5ff 0%, #00c5ff 47%, #0383a9 50%, #0383a9 100%) !important;
}

.dark-theme button {
  border: 1px solid white !important;
  display: block !important;
  padding: .5rem 1rem !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  border-radius: .3rem !important;
  background: rgba(0, 0, 0, 0.5) !important;
  color: rgba(240, 240, 240, 1) !important;
  font-weight: 400;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.dark-theme button:hover {
  border: 1px solid white !important;
  display: block !important;
  padding: .5rem 1rem !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  border-radius: .3rem !important;
  background: url(images/bg.png), linear-gradient(to bottom, hsla(47, 59%, 78%, 0.75) 1%, hsla(47, 74%, 60%, .75) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4286f4', endColorstr='#005cf2', GradientType=0);
  border-color: white;
  box-shadow: 0px 0px 10px hsla(47, 74%, 60%, .75) !important;
  color: rgba(255, 255, 255, 1) !important;
}

@media (max-width:980px) {
  .col {
    width: 100%;
    flex-basis: 1 !important;
    margin-left: 0 !important;
  }

  .col-lg-1,
  .col-lg-10,
  .col-lg-11,
  .col-lg-12,
  .col-lg-2,
  .col-lg-3,
  .col-lg-4,
  .col-lg-5,
  .col-lg-6,
  .col-lg-7,
  .col-lg-8,
  .col-lg-9,
  .col-md-1,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-sm-1,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-xs-1,
  .col-xs-10,
  .col-xs-11,
  .col-xs-12,
  .col-xs-2,
  .col-xs-3,
  .col-xs-4,
  .col-xs-5,
  .col-xs-6,
  .col-xs-7,
  .col-xs-8,
  .col-xs-9 {
    width: 100%;
  }
}

@media (min-width:981px) {
  .col {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
  }
}

.col {
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
  margin: .5% 0 1% .5% !important;
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: 0px !important;
  margin-left: 0px !important;
  margin-bottom: 0px;
}

/*----------------------------------------- survey css END -----------------   */