/* CUSTOM NAKNADNE IZMJENE */
button.swal2-confirm.swal2-styled {
  position: relative;
}
/* END CUSTOM NAKNADNE IZMJENE */

/* POSLOVNI KORISNICI & Additional tweaks */
.survey {
  width: 100%;
  min-width: 1024px;
  padding-bottom: 2em;
  margin-bottom: 2em;
}

input[type='submit'],
input[type='button'] {
  font-size: 1em;
  position: absolute;
  height: 40px;
  bottom: -40px;
  width: 8em;
}

input[type='submit'].next,
input[type='button'].next,
input[type='submit'].submit,
input[type='button'].submit {
  right: 3em;
  border-radius: 0 0.2em 0.2em 0;
}

input[type='submit'].back,
input[type='button'].back {
  right: 11em;
  border-radius: 0.2em 0 0 0.2em;
}

.back-fake {
  position: absolute;
  right: 11em;
  bottom: -40px;
  height: 40px;
  width: 8em;
  background: white;
}

.progress {
  width: calc(100% - 22em);
  height: 40px;
  margin-left: 3em;
}

.progress-bar {
  font-size: 1.3em;
  line-height: 1.6em;
}

fieldset {
  min-height: 465px;
}

.poslovni-header,
.poslovni-subheader {
  font-size: 1em;
  text-align: center;
  padding: 1.5em 4em 2em 4em;
}

.survey-content {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.survey-content-square {
  width: 48%;
  margin: 2em 0;
}

.survey-content-square > p {
  text-align: justify;
  padding-left: 0.5em;
  padding-right: 0;
}

.survey-content-square > img {
  width: 100%;
  height: auto;
}

.survey svg path,
.survey svg polygon,
.survey svg rect {
  fill: #0097d3;
}

.survey {
  background: url("./img/grey-bg.svg") no-repeat 0 0;
  background-size: cover;
}

input[type='checkbox']:checked + label {
  box-shadow: 0px 0px 0px 3px #0097d3;
}

input[type='checkbox'],
input[type='radio'] {
  display: none;
}


input[type='submit'],
input[type='button'] {
  display: block;
  border: 0;
  cursor: pointer;
  background: #0097d3;
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
}

.progress {
  position: relative;
  background: #fff;
  overflow: hidden;
  border-radius: 0.2em;
}

.progress-bar {
  color: #fff;
  height: 100%;
  font-weight: bold;
  border-radius: 0 0.2em 0.2em 0;
  text-align: center;
  background: #0097d3;
  transition: width .6s ease;
}

fieldset {
  height: 100%;
  position: relative;
  border: none;
}

.fieldset-header {
  padding: 2em 2em 1.5em 2em;
  background: url("img/bg.svg") no-repeat 0 0;
  background-size: cover;
  color: #fff;
}

.fieldset-header h2 {
  font-size: 1.875em;
}

.fieldset-body {
  padding: 3em 3em;
  display: flex;
}

fieldset:not(:first-of-type) {
  display: none;
}

fieldset:first-of-type .fieldset-body {
  justify-content: space-between;
  align-items: center;
}

fieldset:nth-of-type(2) .fieldset-body {
  justify-content: space-between;
  align-items: center;
}

fieldset:nth-of-type(3) .fieldset-body {
  justify-content: space-around;
  align-items: center;
}

fieldset:nth-of-type(4) .fieldset-body {
  justify-content: center;
  align-items: center;
}

fieldset:nth-of-type(4) .fieldset-body label {
  margin: 0 4em;
}

fieldset:nth-of-type(5) .fieldset-body {
  justify-content: space-between;
  align-items: center;
}

fieldset:nth-of-type(6) .fieldset-body {
  justify-content: space-between;
  align-items: center;
}

fieldset:nth-of-type(7) .fieldset-body {
  justify-content: center;
  align-items: center;
}

fieldset:nth-last-of-type(-n+2) input:not([type='button']):not([type='submit']) {
  display: block;
  padding: 0.5em;
  margin: 2em;
  width: calc(50% - 3em);
  height: 60px;
  font-size: 1.3em;
  line-height: 1.6em;
  border: 0;
}

fieldset:nth-last-of-type(-n+2) input:not([type='button']):not([type='submit'])::placeholder {
  color: #888;
}

fieldset:nth-last-of-type(-n+2) input:not([type='button']):not([type='submit']):focus {
  box-shadow: 0px 0px 0px 3px #0097d3;
  transition: 0.2s;
  color: #888;
}

fieldset:nth-last-of-type(-n+2) label {
  display: none;
}

fieldset:not(:nth-last-of-type(-n+2)) label {
  position: relative;
  cursor: pointer;
  display: block;
  width: 180px;
  height: 180px;
  border-radius: 0.2em;
  background: #fff;
}

fieldset:not(:nth-last-of-type(-n+2)) label svg {
  position: absolute;
  top: 20px;
  left: 40px;
  width: 100px;
  height: 100px;
}

fieldset:not(:nth-last-of-type(-n+2)) label span {
  position: absolute;
  height: 3em;
  width: 160px;
  bottom: 0;
  left: 10px;
  text-transform: uppercase;
  text-align: center;
  color: #0097d3;
  font-size: 0.7em;
  line-height: 1.3em;
  font-weight: bold;
}

fieldset:not(:nth-last-of-type(-n+2)) label:hover {
  transition: 0.8s;
  background: #0097d3;
}

fieldset:not(:nth-last-of-type(-n+2)) label:hover span {
  color: #fff;
}

fieldset:not(:nth-last-of-type(-n+2)) label:hover svg path,
fieldset:not(:nth-last-of-type(-n+2)) label:hover svg polygon,
fieldset:not(:nth-last-of-type(-n+2)) label:hover svg rect {
  fill: #fff !important;
}

fieldset:last-of-type .fieldset-body {
  padding: 2em 10%;
}

fieldset:last-of-type .survey-contact {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

fieldset:last-of-type input:not([type='button']):not([type='submit']) {
  width: 17em;
  margin: 0 1em 2em 1em;
}

fieldset:last-of-type input[type='submit'] {
  width: 30%;
  left: 35%;
  bottom: 1em;
}

#dodatne-napomene {
  display: block;
  font-family: 'Bosch Sans', Helvetica, Arial, sans-serif;
  font-size: 1.3em;
  line-height: 1.6em;
  padding: 0.5em;
  width: calc(100% - 3.5em);
  height: 8em;
  resize: none;
  margin-bottom: 2em;
  border: 0;
}

#dodatne-napomene::placeholder {
  color: #888;
}

#dodatne-napomene:focus {
  box-shadow: 0px 0px 0px 3px #0097d3;
  transition: 0.2s;
  color: #888;
}
/* END POSLOVNI KORISNICI & Additional tweaks */