body {
  font-family: Lato, Arial, Helvetica Neue, Helvetica, sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #fff;
  background-color: #02104F;
  overflow: hidden;
}

html,
body {
  height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: Lato, Arial, Helvetica Neue, Helvetica, sans-serif;
  font-weight: 700;
}

p {
  margin: 0;
  line-height: 1.2em;
}

table {
  width: 100%;
}

.alert {
  font-size: .875em;
  text-align: center;
}

.noscroll {
  overflow: hidden;
}


a,
button,
.btn {
  transition: all .2s linear;
}

a:hover,
button:hover {
  text-decoration: none;
}

a:focus,
button:focus {
  outline: none;
  text-decoration: none;
}




/* Buttons */

.btn {
  line-height: 1em;
  font-size: .875em;
  font-weight: 400;
  border-radius: 35px;
  padding: 1.2em .8em;
  border: none;
  font-weight: 700;
}

.rounded {
  border-radius: 30px;
  padding-left: 35px;
  padding-right: 35px;
}

.btn-primary,
.btn-primary:focus {
  background-color: #fff;
  color: #111;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:active:hover {
  background-color: rgba(255, 255, 255, .85);
  color: #111;
}

.btn-rounded {
  border: 2px solid #F24738;
  display: block;
  border-radius: 25px;
  font-weight: 700;
  color: #F24738;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.btn-rounded:hover,
.btn-rounded:active,
.btn-rounded:focus {
  background-color: #F24738;
  color: #fff;
}

.btn-back {
  color: #fff;
}

.btn-back:focus {
  color: #fff;
}

.btn-back .icon-arrow {
  margin-right: 6px;
  display: inline-block;
  transform: rotate(180deg);
}

.btn-default {
  color: #fff;
  background-color: #777;
  border: none;
}

.btn-default:hover {
  background-color: #888;
  color: #fff;
}

.btn-outline {
  color: rgba(255, 255, 255, .9);
  background-color: transparent;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .45);
  padding: 12px 20px;
  border-radius: 35px;
  max-width: 390px;
  margin: 0 auto;
  font-size: 1em;
  font-weight: 700;
}

.btn-outline:hover {
  background-color: #fff;
  color: #111;
}

.btn-withendicon i {
  margin-left: 3px;
  position: relative;
  top: 1px;
}

.larger {
  font-size: 1.05em;
}

.btn-fat {
  padding-top: 17px;
  padding-bottom: 17px;
  font-size: 1em;
}

.btn.withfronticon [class^="icon-"],
.btn-text.withfronticon [class^="icon-"] {
  margin-right: 8px;
  font-size: 1.1em;
  position: relative;
  top: 1px;
}

.btn.withlasticon [class^="icon-"] {
  margin-left: 10px;
  margin-right: 5px;
  position: relative;
  top: 1px;
  -webkit-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  -moz-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  -o-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
}

.btn-text.withlasticon [class^="icon-"] {
  margin-left: 4px;
  margin-right: 5px;
  position: relative;
  top: 1px;
  -webkit-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  -moz-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  -o-transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
  transition: all 300ms cubic-bezier(0.250, 0.460, 0.450, 0.940);
}

.btn.withlasticon:hover .icon-arrow,
.btn.withlasticon:hover .icon-arrow-alt {
  margin-left: 15px;
  margin-right: 0;
}

.btn-text.withlasticon:hover .icon-arrow {
  margin-left: 9px;
  margin-right: 0;
}


.darkoverlay {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 30;
  transition: all 350ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
  background-color: rgba(0, 0, 0, .35);
  opacity: 0;
  visibility: hidden;
}



.redbg {
  background-color: #690203;
}



/* Poll */

.poll {
  /*
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; */
}

.poll .bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  left: 0;
  top: 0;
  width: 140%;
  height: 100%;
  z-index: 0;
  opacity: 0;
  transition: .8s ease-out;
  transform: scale3d(1.2, 1.2, 1.2);
}

.poll .bg:before {
  content: "";
  display: inline-block;
  background-color: rgba(9, 34, 62, 0.65);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  display: none;
}

.start .poll .bg {
  opacity: 1;
  transform: scale3d(1, 1, 1);
}




/* Header bar */

.header {
  background-color: rgba(0, 0, 0, .85);
  text-align: center;
  padding: 8px 15px;
  position: relative;
  z-index: 5;
  opacity: 0;
  transform: translate3d(0, -50px, 0);
  -webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
  transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
}

.header p,
.header a {
  font-family: Helvetica Neue, Arial, Helvetica, sans-serif, sans;
  font-size: 14px;
}

.header a {
  color: #fff;
}

.header a:hover {
  opacity: .8;
}

.header a img {
  width: 18px;
  height: auto;
  margin-right: 4px;
  opacity: .65;
  position: relative;
  top: -1px;
}

.header-inner {
  display: inline-flex;
  align-items: center;
}

.header-inner>* {
  padding: 0 8px;
}

.header .header-logout {
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
}



.branding {
  padding: 35px 20px;
  transition: all 450ms cubic-bezier(0.175, 0.885, 0.320, 1.275) 150ms;
  transform: translateY(-5vw) scale(1.1);
  opacity: 0;
  text-align: center;
}

.branding img {
  width: 100%;
  height: auto;
}

.start .branding {
  opacity: 1;
  transform: translateY(0);
}

.branding .logo-encuesta,
.branding .logo-lpdh {
  max-width: 400px;
}


.question {
  flex: 0 0 auto;
  text-align: center;
  padding: 0 15px;
  transition: all 450ms cubic-bezier(0.175, 0.885, 0.320, 1.275) 150ms;
  transform: translateY(-5vw) scale(1.1);
  opacity: 0;
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
  font-size: 26px;
}

.question h3 {
  line-height: 1.1em;
  margin: 0;
  font-size: inherit;
}

.question.long h3 {
  font-size: .8em;
}

.question.longer h3 {
  font-size: .7em;
}

.question span {
  display: inline-block;
  line-height: 1.1em !important;
  font-weight: 700;
}

.start .question {
  opacity: 1;
  transform: translateY(0);
  transition-delay: .3s;
}



/* Content Block */

.content {
  max-width: 700px;
  width: 100%;
  flex: 0 0 auto;
}



.vote-box {
  padding: 20px 20px;
}

.votes {
  text-align: center;
  position: relative;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
}

.votes .vote {
  position: relative;
  opacity: 0;
  transition: all 350ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
  transform-origin: center;
  transform: scale(.5);
  flex: 0 0 auto;
}

.start .vote {
  transform: scale(1);
  opacity: 1;
  transition-delay: .4s;
}

.start .vote:nth-child(2) {
  transition-delay: .6s;
}


.votes a {
  display: block;
  position: relative;
  border-radius: 50px;
  margin: 5px 0;
}

.votes a:hover {
  box-shadow: 0 0 8px 5px rgba(255, 255, 255, .13);
}

.votes a:active,
.votes a.selected {
  z-index: 3;
  transform: scale(1.05);
  background-color: rgba(255, 255, 255, .5);
}

.votes a.selected .vote-name p {
  color: #111;
}

.votes a.selected .vote-item-bg-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}

.votes a.selected .circle {
  box-shadow: 0 0 0 4px #2B2367;
  transform: translateY(-50%) scale(1.05);
}

.vote-item-bg {
  width: 100%;
  height: auto;
}

.vote-item-bg-active {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  transition: .15s ease-out;
  opacity: 0;
  visibility: hidden;
  transform: scale(.85);
}


.vote-name {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  z-index: 4;
  text-align: center;
}

.votes-noimg .vote-name {
  width: 100%;
  left: 0;
  transform: translateY(-50%);
  padding: 0 25px;
}

.vote-name img {
  width: 100%;
  height: auto;
}

.vote-name p {
  color: #111;
  font-weight: 700;
  font-size: 2em;
  line-height: 1em;
}

.votes-dual {
  flex-direction: row;
}

.votes-dual .vote {
  flex: 1 1 auto;
}

.votes-dual .vote-name p {
  font-size: 1.5em;
}

.votes-dual a {
  border-radius: 70px;
}

.votes-dual a i {
  display: block;
  font-size: 1.8em;
  margin-bottom: 5px;
  color: #111;
}

.votes-dual .vote1 a {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: 2px;
}

.votes-dual .vote2 a {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: 2px;
}






.orcircle {
  width: 25px;
  height: 25px;
  line-height: 25px;
  background-color: #F5AB3D;
  text-align: center;
  padding: 0;
  font-size: 10px;
  border-radius: 50%;
}



.content .head {
  display: inline-block;
  background-color: rgba(255, 255, 255, .85);
  padding: 9px;
  border-radius: 50%;
  position: relative;
  z-index: 10;
  -webkit-transition: all 250ms cubic-bezier(0.215, 0.610, 0.355, 1.000);
  transition: all 250ms cubic-bezier(0.215, 0.610, 0.355, 1.000);
}






/* Footer */

.start .footer {
  transform: translateY(0);
  opacity: 1;
  transition-delay: 1s;
}


.footer {
  flex: 0 0 auto;
  padding-top: 1.5em;
  text-align: center;
  position: relative;
  -webkit-transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
  transition: all 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000);
  opacity: 0;
  transform: translateY(20vw);
}

.footer-results {
  padding: 0 20px;
  padding-bottom: 15px;
}

.footer-logo img {
  width: 70px;
  height: auto;
}

.footer-logo-corner {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 8px;
}

.footer-logo-corner img {
  width: 18vw;
  height: auto;
}

.footer-powered {
  padding-top: 15px;
}

.footer-powered>* {
  display: inline-block;
  vertical-align: middle;
}

.footer-powered p {
  font-size: 10px;
  margin: 0;
  margin-right: 4px;
  font-family: Helvetica Neue, Arial, Helvetica, sans-serif, sans;
}

.footer-powered img {
  width: 60px;
  height: auto;
  position: relative;
  top: -2px;
}





/* Preloader */

.preloader {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 105;
}

.preloader .circle {
  width: 220px;
  height: 220px;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 50%;
  margin: 0 auto;
  position: relative;
  top: 50%;
  margin-top: -110px;
}

.preloader .line {
  margin: -20px;
  opacity: 0;
}

.preloader .head {
  position: absolute;
  width: 100%;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  font-size: 13px;
}

.preloader .head .show {
  color: #fff;
  margin: 0;
  margin-top: 8px;
  line-height: 1em;
  opacity: .6;
  position: relative;
  display: inline-block;
}

.preloader .head .show:before,
.preloader .head .show:after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 4px;
  background-color: #fff;
  margin: 4px 8px;
  opacity: .5;
}

.preloader h2 {
  color: #fff;
  text-align: center;
  margin: 0;
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.1em;
  padding: 0 20px;
}

.preloader-logo {
  width: 100px;
  height: auto;
}

.loadmsg {
  color: #fff;
  margin-top: 25px;
}

.loadmsg p {
  margin: 0;
  line-height: 1.1em;
}

.loadmsg .percent {
  font-size: 15px;
  margin-bottom: 5px;
  line-height: .9em;
}

.loadmsg .loading {
  font-size: 10px;
  letter-spacing: 1px;
  opacity: .6;
}



.loader {
  margin: 30px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: .6em solid rgba(45, 54, 68, .2);
  border-right: .6em solid rgba(45, 54, 68, .2);
  border-bottom: .6em solid rgba(45, 54, 68, .2);
  border-left: .6em solid rgba(45, 54, 68, .65);
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}

.loader,
.loader:after {
  border-radius: 50%;
  width: 4em;
  height: 4em;
}

@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}



/* Overlay Form */

.main-content {
  transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000) 200ms;
  position: relative;
  width: 100%;
  /*
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  bottom: 0;
  */
  display: flex;
  flex-direction: column;
  display: -ms-flexbox;
  -ms-flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.main-content-withheader {
  top: 32px;
}


.show-results .main-content {
  margin-left: -100%;
  transition-delay: 500ms;
}

.show-results .footer {
  transform: translateY(20vw);
  transition-delay: 500ms;
  opacity: 0;
  visibility: hidden;
}

.show-results .question {
  transform: translateY(-5vw) scale(.8);
  transition-delay: 500ms;
  opacity: 0;
  visibility: hidden;
}

.show-results .overlay {
  left: 0;
  transition-delay: 500ms;
  opacity: 1;
  visibility: visible;
}

.show-results .bg {
  left: -20%;
}

.show-results .votes .vote {
  transform: scale(.65);
  opacity: 0;
  transition-delay: 1s;
}



.btn-backtostart {
  font-size: 13px;
  font-weight: 700;
  background-color: rgba(255, 255, 255, .12);
  border-radius: 20px;
  transition: .3s ease-out;
  position: absolute;
  padding: 8px 12px;
  left: 4px;
  top: -50px;
  opacity: 0;
  z-index: 50;
}

.btn-backtostart:hover,
.btn-backtostart:focus {
  color: #111;
  background-color: rgba(255, 255, 255, .8);
}

.show-results .btn-backtostart {
  top: 4px;
  opacity: 1;
  transition-delay: 800ms;
}

.btn-nextpoll {
  display: block;
  position: absolute;
  bottom: 5px;
  left: 10px;
  right: 10px;
  transform: translateY(100%);
  opacity: 0;
  z-index: 35;
}

.show-results .btn-nextpoll {
  transition-delay: 2500ms;
  opacity: 1;
  transform: translateY(0);
}



/* Results Overlay */

.overlay {
  position: fixed;
  top: 0;
  left: 100%;
  width: 100%;
  height: 100%;
  z-index: 30;
  -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
  transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
  opacity: 0;
  visibility: hidden;
  display: flex;
  flex-direction: column;
}

.overlay-withheader {
  top: 30px;
}

.overlay .head {
  flex: 0 0 auto;
}

.overlay .body {
  flex: 1 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}



.results {
  width: 100%;
  padding: 0 20px;
}

.list-resultbars {
  margin: 0;
}

.list-resultbars li {
  margin: 10px 0;
  position: relative;
  padding-left: 58px;
}

.list-resultbars-noimg li {
  padding-left: 0;
}

.list-resultbars-noimg .result-item p {
  font-size: 1.25em;
}

.list-resultbars-noimg .result-item p .value {
  font-size: 1.15em;
}

.result-item p {
  margin: 0;
  line-height: 1.2em;
}

.list-resultbars .result-item--selected {
  transform: scale(1.1);
}

.list-resultbars .result-item--selected .barbg {
  background-color: rgba(255, 255, 255, .8);
}

.list-resultbars .result-item--selected .bar {
  background-color: rgba(255, 255, 255, .85);
}

.list-resultbars .result-item--selected .perc {
  color: #433894;
}

.list-resultbars .result-item--selected p {
  color: #433894;
}

.list-resultbars .result-item--selected .circle {
  box-shadow: 0 0 0 4px #413595, 0 0 8px 6px rgba(43, 35, 103, .5);
}

.list-resultbars .result-item--correct .bar {}

.list-resultbars .result-item--correct .perc {}


.bars>* {
  display: inline-block;
  vertical-align: top;
  width: 50%;
  padding: 0 15px;
  margin-right: -4px;
  text-align: center;
}

.bars p {
  margin: 0;
  line-height: 1.1em;
  font-weight: 700;
  font-size: 1.2em;
  color: #F24738;
}

.barbg {
  width: 100%;
  height: 56px;
  background-color: rgba(255, 255, 255, .35);
  display: inline-block;
  margin-top: 5px;
  position: relative;
  border-radius: 35px;
  overflow: hidden;
}

.bar {
  height: 100%;
  width: 5%;
  position: absolute;
  top: 0;
  left: 0;
  padding-right: 5px;
  text-align: left;
  overflow: visible !important;
  background: -moz-linear-gradient(left, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.25) 1%, rgba(255, 255, 255, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.25) 1%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.25) 1%, rgba(255, 255, 255, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40ffffff', endColorstr='#ffffff', GradientType=1);
  border-radius: 35px;
}

.bar p,
.result2 .bar p {
  color: #fff;
  font-size: 18px;
  line-height: 56px;
  font-weight: 700;
}

.bar .perc {
  color: #fff;
  position: relative;
  margin-left: calc(100% + 12px);
}

.bar.altpercent .perc {
  color: #111;
  margin-left: calc(100% - 55px);
}



/* Story CTA */

.foot-cta {
  padding: 10px;
  padding-bottom: 60px;
}

.btn-ctaitem {
  display: flex;
  align-items: center;
  background-color: rgba(255, 255, 255, 0.16);
  position: relative;
  color: #fff;
}

.btn-ctaitem:hover {
  background-color: #fff;
  color: #080F13;
}

.btn-ctaitem:after {
  content: "\e901";
  font-family: "icomoon";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  opacity: .65;
}

.btn-ctaitem p {
  font-weight: 700;
  font-size: 17px;
  text-transform: none;
}

.ctaitem-copy {
  padding: 5px 12px;
  padding-right: 35px;
}

.ctaitem-img {
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  min-height: 75px;
  width: 110px;
  flex: 0 0 auto;
}



@font-face {
  font-family: 'icomoon';
  src: url('../webfonts/icomoon.eot?mfvsxb');
  src: url('../webfonts/icomoon.eot?#iefixmfvsxb') format('embedded-opentype'),
  url('../webfonts/icomoon.woff?mfvsxb') format('woff'),
  url('../webfonts/icomoon.ttf?mfvsxb') format('truetype'),
  url('../webfonts/icomoon.svg?mfvsxb#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"],
[class*=" icon-"] {
  font-family: 'icomoon';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-dem:before {
  content: "\e900";
}

.icon-female:before {
  content: "\e901";
}

.icon-male:before {
  content: "\e902";
}

.icon-rep:before {
  content: "\e903";
}

.icon-arrow:before {
  content: "\e901";
}

.icon-ccard:before {
  content: "\e905";
}

.icon-download:before {
  content: "\e906";
}

.icon-email:before {
  content: "\e907";
}

.icon-facebook:before {
  content: "\e908";
}

.icon-flag:before {
  content: "\e909";
}

.icon-google:before {
  content: "\e90a";
}

.icon-instagram:before {
  content: "\e90b";
}

.icon-linkedin:before {
  content: "\e90c";
}

.icon-menu:before {
  content: "\e90d";
}

.icon-negative:before {
  content: "\e90e";
}

.icon-password:before {
  content: "\e90f";
}

.icon-pdf:before {
  content: "\e910";
}

.icon-phone:before {
  content: "\e911";
}

.icon-photos:before {
  content: "\e912";
}

.icon-pinterest:before {
  content: "\e913";
}

.icon-play:before {
  content: "\e914";
}

.icon-plus:before {
  content: "\e915";
}

.icon-pluscircle:before {
  content: "\e916";
}

.icon-positive:before {
  content: "\e917";
}

.icon-product:before {
  content: "\e918";
}

.icon-rss:before {
  content: "\e919";
}

.icon-search:before {
  content: "\e91a";
}

.icon-share:before {
  content: "\e91b";
}

.icon-signup:before {
  content: "\e91c";
}

.icon-slack:before {
  content: "\e91d";
}

.icon-star:before {
  content: "\e91e";
}

.icon-support:before {
  content: "\e91f";
}

.icon-trenddn:before {
  content: "\e920";
}

.icon-trendup:before {
  content: "\e921";
}

.icon-twitter:before {
  content: "\e922";
}

.icon-user:before {
  content: "\e923";
}

.icon-users:before {
  content: "\e924";
}

.icon-x:before {
  content: "\e925";
}

.icon-youtube:before {
  content: "\e926";
}



@media screen and (max-width: 650px) {
  .poll-mobilescrollable {
    overflow-y: auto;
    overflow-x: hidden;
  }
  .content-full {
    position: static;
    transform: none;
    left: auto;
    top: auto;
  }

  .vote-box-delimited:before {
    display: none;
  }
  .posts:before {
    display: none;
  }
  .post--first:before {
    content: "vs";
    display: inline-block;
    text-align: center;
    font-weight: 700;
    font-size: 18px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border-radius: 50%;
    background-color: #222;
    color: #fff;
    position: absolute;
    bottom: -20px;
    left: 50%;
    margin-left: -20px;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, .1);
    z-index: 20;
  }
  .post {
    display: block;
    width: 100%;
    margin-right: 0;
    padding: 20px 0;
  }
  .post--first {
    border-bottom: 1px solid rgba(0, 0, 0, .1);
  }
  .votes-large {
    display: none;
  }
  .votes-mobile {
    display: block;
    padding-bottom: 25px;
  }
}



@media screen and (min-width: 600px) {}


@media only screen and (max-width: 599px) {

  .header {
    padding: 6px 15px;
  }
  .header a {
    display: inline-block;
    padding: 6px 8px;
    margin: -6px 0;
  }
  .header a span {
    display: none;
  }
  .header a img {
    margin: 0;
    opacity: 1;
  }
  .header-inner>* {
    padding: 0;
  }
  .header .header-score {
    padding-left: 6px;
  }
  .header .header-logout {
    right: 0;
  }
}



/* -- Landscape mode media query -- */

@media only screen and (orientation: landscape) {}


/* -- Portrait mode media query -- */

@media only screen and (orientation: portrait) {}

@media screen and (min-width: 400px) and (orientation: portrait) {}


@media screen and (min-width: 700px) {

  body {
    overflow: hidden;
  }

  .question {
    padding-top: 20px;
  }

  .votes-dual .vote {
    flex: 1;
  }

  .barbg {
    height: 10vh;
    width: 100%;
  }
  .bar .perc,
  .list-resultbars-noimg .result-item .bar p {
    line-height: 10vh;
    font-size: 1.85em;
  }
  .bar.altpercent .perc {
    margin-left: calc(100% - 80px);
  }
  .list-resultbars li {
    margin: 18px 0;
    padding-left: 0;
  }
  .list-resultbars .circle {
    width: 11vh;
    height: 11vh;
    bottom: 0.3vh;
    left: auto;
    right: 100%;
    transform: translateX(10px);
  }
  .result-item p,
  .list-resultbars-noimg .result-item p {
    font-size: 1.8em;
  }


  .bars .circle {
    width: 120px;
    height: 120px;
  }

  .results {
    max-width: 600px;
  }

  .footer-logo img {
    width: 60px;
  }
  .footer-logo-corner img {
    width: 90px;
  }


  .btn-nextpoll {
    display: inline-block;
    position: absolute;
    bottom: 10px;
    left: auto;
    right: 10px;
    transform: scale(.2);
    opacity: 0;
    visibility: hidden;
    padding: 20px 50px;
  }
  .show-results .btn-nextpoll {
    transform: scale(1);
    transition: transform 350ms cubic-bezier(0.175, 0.885, 0.320, 1.275) 2300ms, opacity 200ms linear 2300ms, background-color 200ms linear;
    visibility: visible;
    opacity: 1;
  }


  .foot-cta {
    padding: 15px 0;
    padding-bottom: 85px;
    max-width: 650px;
    align-self: center;
  }
}


@media screen and (min-width: 480px) {

  .branding {
    padding: 20px;
    padding-bottom: 40px;
  }
  .question {
    padding-top: 0;
  }
  .votes {
    margin: 0 auto;
    max-width: 390px;
  }
  .vote-box {
    overflow: visible;
    padding: 0;
    padding-top: 20px;
    width: 390px;
    margin: 0 auto;
  }
}


@media screen and (max-width: 360px) {

  .question {
    font-size: 20px;
  }

  .branding .logo-encuesta,
  .branding .logo-lpdh {
    max-width: 250px;
  }
  .branding {
    padding: 15px 20px;
    padding-bottom: 30px;
  }

  .btn-ctaitem p {
    font-size: 15px;
  }
}