@font-face { font-family: 'NewJuneHeavy';
    src: url('font/NewJuneHeavy.eot?#iefix') format('embedded-opentype'),  url('font/NewJuneHeavy.otf')  format('opentype'),
          url('font/NewJuneHeavy.woff') format('woff'), url('font/NewJuneHeavy.ttf')  format('truetype'), url('font/NewJuneHeavy.svg#NewJuneHeavy') format('svg');
    font-weight: normal;   font-style: normal; }
 @font-face {     font-family: 'NewJuneRegular';
      src: url('font/NewJuneRegular.eot?#iefix') format('embedded-opentype'),  url('font/NewJuneRegular.otf')  format('opentype'),
             url('font/NewJuneRegular.woff') format('woff'), url('font/NewJuneRegular.ttf')  format('truetype'), url('font/NewJuneRegular.svg#NewJuneRegular') format('svg'); font-weight: normal;font-style: normal;  }
 @font-face {     font-family: 'NewJuneSemibold';
      src: url('font/NewJuneSemibold.eot?#iefix') format('embedded-opentype'),  url('font/NewJuneSemibold.otf')  format('opentype'),
             url('font/NewJuneSemibold.woff') format('woff'), url('font/NewJuneSemibold.ttf')  format('truetype'), url('font/NewJuneSemibold.svg#NewJuneSemibold') format('svg'); font-weight: normal;  font-style: normal; }
 *,html, body{font-family: 'NewJuneRegular',sans-serif;  text-align: left; }
/*---*/
html {
  background: lightgrey;
  overflow: hidden;
}
body {
  height: 100vh;
  overflow-y: auto;
  margin: 0 auto;
}
html { overflow: hidden; }
body::-webkit-scrollbar { width: 11px;}
body { overflow-y: auto; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: #90A4AE #CFD8DC;}
body::-webkit-scrollbar-track {  background: #CFD8DC;}
body::-webkit-scrollbar-thumb {  background-color: #a0c240 ;  border-radius: 6px;  border: 3px solid #a0c240;}
 body { background-color: #eae7e0; margin-top: 0px!important; padding-top: 0px!important; padding-bottom: 50px;}
 .container{max-width:768px; background: #ffffff;  }

 body {  padding: 0em 1.25em 3.2em;  margin-top: 5px; }
 .extraBold {font-weight: 800;}
 .Bold {font-family: 'NewJuneHeavy',sans-serif!important; }
 .semiBold, strong {font-family: 'NewJuneSemibold',sans-serif!important; color:inherit }
 a {text-decoration:none;}
 a:hover {text-decoration:none;}
 ul {margin-top: 0; margin-bottom: 0px;}
 /*colors*/
 .txt-gray {color: #a2a9ab!important;}
 .txt-dark-gray {color: #313131!important;}
 .txt-w, a.txt-w:hover {color: #ffffff;}
 .txt-black {color: #000000!important;}
 .txt-shadow {text-shadow: 2px 2px 3px rgba(0, 0, 0, .9);}
 .txt-rosa   { color: #ac0a5e!important;}
 .txt-verde  { color: #a0c240;}
 .txt-azul   { color: #017Eac;}
 .txt-morado { color: #48194d;}
  /*tipos*/
 h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {font-size:none; font-weight: normal;}
 .txt-xl {font-size: 1.8em; }
 .txt-x {font-size: 1.6em; }
 .txt-m {font-size: 1.4em!important; }
 .txt-s {font-size: 1em!important; }
 .txt-xs {font-size: .9em!important; }
 .txt-xxs {font-size: .8em; }
 .txt-xxxs {font-size: .6em; }
 .txt-height-s {line-height: 1em;}
 .txt-height-xs {line-height: .9em;}
 .txt-height-xxs {line-height: .8em;}



 .txt-underline {text-decoration: underline;}
 .u-ov {overflow: hidden;}
 .d-cursor {cursor:pointer;}
 .d-cursor:hover {text-decoration: none;}
 .rounded {border-radius: 50px!important;}
 .area-rounded {border-radius: 0px 0px 0px 120px;}
 .mt--10 {margin-top: -10px;}
 .border-right {border-right: 1px solid rgba(0,0,0,.1);}
 hr {    border-top: 1px solid #eae7e0;}

 /*background*/
 .bg-white{background: #ffffff;}
 .bg-rosa {background:  #ac0a5e;}
 .bg-rosa-2 {background: #6b174a;}
 .bg-morado{background:#48194d;}
 .bg-verde {background: #a0c240;}



 .row-eq-height {  display: -webkit-box;  display: -moz-box;  display: -ms-flexbox;  display: -webkit-flex;  display: flex; }

 /*botones*/
 .btn { text-decoration: none!important; border: none;  border-radius: 4px; -webkit-appearance: none;  margin: 7px 0 0;  font-family: 'NewJuneRegular';  color: #FFF;padding: .15rem .75rem;
    -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s;   transition-duration: 0.5s;}
 .btn:hover{-webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; }
 .btn-md {width: 220px;}
 .btn-center {display: block!important; margin:0 auto;}
 .btn.bg-rosa { color:#ffffff; border:1px solid #ac0a5e;}
.btn.bg-rosa:hover {background: #ffffff!important;color:#ac0a5e!important; border:1px solid #ac0a5e;}

/*BUTTON SIGUIENTE*/
 .btn.disabled, .btn:disabled {opacity: 1;}
 #siguiente { background: #ffffff url(../img/angle-right.svg) 75% center no-repeat!important; background-size: 20px!important; color:#6b174a!important; border:1px solid #48194d; padding-right:25px}
 #siguiente:disabled {background: #48194d url(../img/angle-right-w.svg) 75% center no-repeat!important; background-size: 20px!important; color:#ffffff!important; border:1px solid #ffffff; }

 /*header*/
 header {text-align: center; }
 header img {width: 400px; margin: 20px auto 40px;}

 /*CONTENEDORES*/
/* .content {display: none;} */
/* .content#cont1 {display: block;} */
form {position: relative;}
 /* PASARELA */
 .flecha{width:20px;height:20px;display:none;position:absolute;/*bottom:20px;*/ bottom: 70px; right:10px;
  /* background:url(../img/icon-backtotop.png) center no-repeat;background-size:80%; */
  cursor:pointer;z-index:999999;}
 .flecha::before {content:'\025bc'; color:#48194d; display: block; width: 20px; height: 20px; font-size: 2em;}
 .pasos {position: fixed; bottom:60px; margin:0 auto; left: 1%; right: 5%; width: 100%; text-align: center;}
 .number { width: 30px; height: 30px; display: inline-block; margin: 0 1% 5px; border-radius: 3px; background: rgba(0,0,0,.04); text-align: center; line-height: 40px;
  color: #ac0a5e; border:1px solid #ac0a5e;  font-size: 1em; line-height: 30px;}
 /*ENCUESTA*/
.pregunta {font-size: 1.3em; line-height: 1.3em; color: #ac0a5e; }
.sub-pregunta {padding:8px 0px 10px; font-size: 1em; line-height: 1.1em; color: #48194d; font-family: 'NewJuneRegular',sans-serif!important;}
/* CHECK ENCUESTA*/
.cc-selector input{  margin:0;padding:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; display: none;}
.icon{ width: 40px; height: 40px; display: block; margin: 0 auto; border-radius: 30px; background: #ac0a5e; text-align: center; line-height: 40px; color:#ffffff; font-size: 1.2em; }
.cc-selector input:active +.label-cc{opacity: .9;}
.cc-selector input:checked +.label-cc{ -webkit-filter: none; -moz-filter: none; filter: none; background: #ac0a5e; color:#ffffff;}
.label-cc{  cursor:pointer; display:inline-block; width:40px;height:40px;
   -webkit-transition: all 100ms ease-in;
      -moz-transition: all 100ms ease-in;
           transition: all 100ms ease-in;

   -webkit-filter: brightness(1.8)  grayscale(1) opacity(.9);
      -moz-filter: brightness(1.8)  grayscale(1) opacity(.9);
           filter: brightness(1.8)  grayscale(1) opacity(.7);
}
.label-cc:hover{
   -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
      -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
           filter: brightness(1.2) grayscale(.5) opacity(.9);
}

 .form-control {border:0px!important;background: #f5f5f1; height: 25px;font-size: .85em; }
 label {font-size: .85em;     margin-bottom: 0px!important; color: #48194d}
 .label-num.custom-control-label::before { border-radius: 10px;}
 .custom-control-input:checked~.custom-control-label::before {   color: #fff;   border-color:  #a0c240; }
 .custom-control-input:checked~.custom-control-label.verde::before {   background-color:  #a0c240; }
 .custom-control-input:checked~.custom-control-label.red::before {   background-color: red; }
 .custom-control-input:checked~.custom-control-label.green::before {   background-color: green; }
 .input-group-text {background-color: transparent!important;border:0px!important; border-bottom: 1px solid #ced4da!important; height: 25px; }
 .input-group-text svg {fill:#ced4da;}





 /*CHECK BOX*/
 .form-check {border-bottom: 1px solid #eae7e0; padding: 10px 0 10px .8rem;}
 .styled-checkbox {position: absolute; opacity: 0; }
  .styled-checkbox + label { position: relative; cursor: pointer; padding: 0; font-size: 1.1em; color: #48194d; font-family: 'NewJuneSemibold',sans-serif!important;}
  .styled-checkbox + label:before { content: ''; margin-right: 20px; margin-top: 3px; display: inline-block; vertical-align: text-top; width: 16px; height: 16px; background: #ffffff; border: 2px solid #b3b3b3; }
  .styled-checkbox:hover + label:before {  background: #ffffff; border: 2px solid #b3b3b3; }
  .styled-checkbox:checked + label:before { background: #ffffff; border: 2px solid #b3b3b3; }
  .styled-checkbox:disabled + label { color: #b3b3b3;  cursor: auto; }
  .styled-checkbox:disabled + label:before { box-shadow: none; background: #ddd;}
  .styled-checkbox:checked + label:after { content: '✔'; position: absolute; left: 1px; top: -1px; color: #84bd00!important; font-size: 1em;  }


 /*footer*/
 footer {position:fixed; bottom: 0px; left: 0px; right: 0px; padding: 10px ;background:#48194d; height: 50px;}
 /* footer select {display:block; margin: 0 auto; width: 200px; height: 40px;  padding: 5px;} */

 footer select option {font-size: 1.2em;}
 /* class applies to select element itself, not a wrapper element */
.select-css {
   display: block;
   color: #ac0a5e;
   font-family: 'NewJuneSemibold',sans-serif;
   line-height: 30px;
   padding: 2px 1.4em 0 .8em;
   width: 220px;
   max-width: 100%; /* useful when width is set to anything other than 100% */
   box-sizing: border-box;
   margin: 0 auto;
   border: 1px solid #48194d;
   box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
   border-radius: 4px;
   -moz-appearance: none;
   -webkit-appearance: none;
   appearance: none;
   background-color: #fff;
   background-image: url(../img/icon-flecha.svg);
   background-repeat: no-repeat, repeat;
   background-position: right 25px top 50%, 0 0;
   background-size: .85em auto, 100%;
   text-align: center;
 }

 .dropdown {
    display: block;
    margin: 0 auto;
    width: 220px;
 }

 .dropdown > .dropdown-toggle {
    color: #ac0a5e;
    font-family: 'NewJuneSemibold',sans-serif;
    line-height: 30px;
    padding: 2px 1.4em 0 .8em;
    width: 220px;
    max-width: 100%; /* useful when width is set to anything other than 100% */
    box-sizing: border-box;
    margin: 0 auto;
    border: 1px solid #48194d;
    box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
    border-radius: 4px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url(../img/icon-flecha.svg);
    background-repeat: no-repeat, repeat;
    background-position: right 25px top 50%, 0 0;
    background-size: .85em auto, 100%;
    text-align: center;
    text-transform: uppercase;
  }

  .dropdown.show > .dropdown-toggle:focus {
    color: #ac0a5e;
    background-color: #fff;
  }

  .dropdown > .dropdown-toggle::after {
      content: none;
  }

  .dropdown > .dropdown-menu.show {
      width: 220px;
  }

  .dropdown > .dropdown-menu.show > a {
    font-size: 1rem;
  }

 /* Hide arrow icon in IE browsers */
 .select-css::-ms-expand {
   display: none;
 }
 /* Hover style */
 .select-css:hover {
   border-color: #48194d;
 }
 /* Focus style */
 .select-css:focus {
   border-color: #48194d;
   /* It'd be nice to use -webkit-focus-ring-color here but it doesn't work on box-shadow */
   box-shadow: 0 0 1px 3px hsl(324deg 17% 26% / 82%);
   box-shadow: 0 0 0 3px -moz-mac-focusring;
   color: #ac0a5e;
   outline: none;
 }

 /* Set options to normal weight */
 .select-css option {
   font-weight:normal;
   font-size: 1.1em;
   color: #48194d;
   background-color:#ffffff;
   padding: 5px;
   height: 38px!important;
   min-height: 3em!important;
   text-align: center;
 }

 /* Support for rtl text, explicit support for Arabic and Hebrew */
 *[dir="rtl"] .select-css, :root:lang(ar) .select-css, :root:lang(iw) .select-css {
   background-position: left .7em top 50%, 0 0;
   padding: .6em .8em .5em 1.4em;
 }

 /* Disabled styles */
 .select-css:disabled, .select-css[aria-disabled=true] {
   color: graytext;
   background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
     linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
 }

 .select-css:disabled:hover, .select-css[aria-disabled=true] {
   border-color: #aaa;
 }

 /*------------------------------------------------------------------------*/

  @media screen and (max-width:470px){
   header img {width: 90%; margin: 0px auto 20px;}
   h1 {font-size: 1.6em!important;}
   body {padding: 0em .4em 3.2em;}
   .pregunta {  font-size: 1.2em; line-height: 1.3em;}
   .sub-pregunta {font-size: .9em;}
.form-check {padding: 6px 0 6px .5rem;}
.styled-checkbox + label {font-size: 1em;}
.styled-checkbox + label:before {    margin-right: 10px;}
   }