@charset "UTF-8";
.container {
  display: none !important; }

.step-2 {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important; }

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0; }

body {
  font-family: 'Open Sans', sans-serif; }

h1 {
  position: absolute;
  z-index: 3;
  left: 0px;
  top: 0px;
  background-color: #e2e2e4;
  width: 100%; }
  h1 img {
    margin: 10px 0 10px 20px;
    max-width: 150px; }
  @media screen and (min-width: 768px) {
    h1 {
      max-width: 160px; } }
  @media screen and (min-width: 1200px) {
    h1 {
      max-width: 240px; }
      h1 img {
        margin: 20px 0 20px 30px;
        max-width: 210px; } }
  @media screen and (min-width: 1600px) {
    h1 {
      max-width: 300px; }
      h1 img {
        margin: 30px 0 30px 40px;
        max-width: 240px; } }

.centerW {
  text-align: center; }

.centerH {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100vh;
  padding: 90px 0 !important; }
  @media screen and (max-width: 576px) {
    .centerH {
      -webkit-box-align: start;
      -ms-flex-align: start;
      align-items: flex-start;
      padding: 0 0 100px !important;
      margin: 90px 0; } }

@media screen and (max-width: 576px) {
  .half .centerH {
    margin: 20px 0; } }

img.imgresp {
  max-width: 100%; }

.wrapper {
  position: absolute;
  height: 100%;
  width: 100%;
  background: #e2e2e4 url("../images/main_bg.jpg") right bottom no-repeat;
  background-size: 100%; }
  @media screen and (min-width: 1600px) {
    .wrapper {
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover; } }

.container {
  position: absolute;
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column wrap;
  flex-flow: column wrap; }
  .container.full {
    overflow-y: scroll; }
  .container .content {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 90px 0px; }
    .container .content .info {
      max-width: 750px;
      padding: 0 20px; }
      @media screen and (max-width: 768px) {
        .container .content .info {
          width: 94vw; } }
      @media screen and (min-width: 769px) {
        .container .content .info {
          width: 100%;
          max-width: 750px;
          padding: 80px 50px !important; } }
  .container.half {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    overflow-y: scroll; }
    .container.half .content {
      -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
      order: 2; }
      .container.half .content .info {
        padding: 30px 20px; }
    @media screen and (min-width: 768px) {
      .container.half {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap; }
        .container.half .content {
          -webkit-box-ordinal-group: 2;
          -ms-flex-order: 1;
          order: 1;
          width: 50%; }
          .container.half .content .info {
            width: auto; } }
    .container.half .halfimage {
      -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
      order: 1;
      width: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      background-repeat: no-repeat;
      padding: 0 30px; }
      .container.half .halfimage.bgcover {
        min-height: 300px;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover; }
      .container.half .halfimage img {
        width: 100%;
        max-width: 600px; }
      @media screen and (max-width: 768px) {
        .container.half .halfimage {
          padding-top: 60px; }
          .container.half .halfimage img {
            max-width: 400px; } }
      @media screen and (min-width: 480px) {
        .container.half .halfimage.bgcover {
          min-height: 400px; } }
      @media screen and (min-width: 768px) {
        .container.half .halfimage {
          z-index: 100;
          -webkit-box-ordinal-group: 3;
          -ms-flex-order: 2;
          order: 2;
          width: 50%; } }

.content p {
  color: #444444;
  font-size: 16px;
  line-height: 23px; }
  .content p b {
    font-weight: 700;
    display: inline-block;
    padding-bottom: 10px;
    font-size: 18px;
    line-height: 24px; }
  @media screen and (min-width: 1600px) {
    .content p {
      font-size: 20px;
      line-height: 28px; }
      .content p b {
        font-size: 24px;
        line-height: 32px; } }
  .content p span {
    color: rgba(68, 68, 68, 0.7); }
    .content p span a {
      font-weight: 700;
      color: rgba(68, 68, 68, 0.7); }

.content span.help {
  font-size: 14px;
  line-height: 18px; }

p.result_info b, p.result_info span.puntuacion_msg {
  font-size: 24px;
  line-height: 30px; }

p.result_info span.puntuacion_msg {
  color: #257fa4;
  font-weight: 600; }

.customBtn {
  position: relative;
  background-color: #ec0000;
  color: #ffffff;
  font-weight: 700;
  -webkit-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  outline: none;
  border: 1px solid transparent;
  padding: 8px 18px;
  border-radius: 4px;
  font-size: 18px;
  line-height: 24px;
  cursor: pointer;
  text-decoration: none; }
  @media screen and (min-width: 768px) {
    .customBtn {
      font-size: 22px;
      line-height: 26px; } }
  .customBtn:hover {
    background-color: rgba(236, 0, 0, 0.7); }

.video {
  width: 100%;
  max-width: 500px; }
  .video .video-responsive {
    overflow: hidden;
    padding-bottom:66.5%;
    position: relative;
    height: 0; }
    .video .video-responsive iframe {
      left: 0;
      top: 0;
      height: 100%;
      width: 100%;
      position: absolute; }
  .video.halfvideo {
    max-width: 100%; }
    @media screen and (min-width: 1600px) {
      .video.halfvideo {
        max-width: 85%; } }

::-webkit-input-placeholder {
  color: rgba(37, 127, 164, 0.5); }

::-moz-placeholder {
  color: rgba(37, 127, 164, 0.5); }

:-ms-input-placeholder {
  color: rgba(37, 127, 164, 0.5); }

:-moz-placeholder {
  color: rgba(37, 127, 164, 0.5); }

input {
  display: block;
  width: 100%;
  color: #257fa4;
  padding: 0px 0px 8px;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 18px;
  -webkit-box-shadow: 0px 2px 0px #257fa4;
  box-shadow: 0px 2px 0px #257fa4;
  background-color: transparent !important; }
  @media screen and (min-width: 768px) {
    input {
      font-size: 24px; } }

.selection {
  margin: 10px 0 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column nowrap;
  flex-flow: column nowrap; }
  @media screen and (min-width: 576px) {
    .selection {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
      flex-flow: row nowrap; } }
  .selection .select-wrapper {
    position: relative;
    width: 100%; }
    @media screen and (min-width: 576px) {
      .selection .select-wrapper {
        width: 48%; } }
    .selection .select-wrapper select {
      width: 100%;
      position: relative;
      z-index: 1;
      cursor: pointer;
      margin-top: 30px;
      color: #257fa4;
      padding: 0px 0px 8px;
      border: none;
      outline: none;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      font-size: 18px;
      -webkit-box-shadow: 0px 2px 0px #257fa4;
      box-shadow: 0px 2px 0px #257fa4;
      background-color: transparent !important; }
      .selection .select-wrapper select option {
        background-color: #e2e2e4; }
    .selection .select-wrapper::after {
      position: absolute;
      z-index: 0;
      content: "\e72d";
      top: 32px;
      right: 10px;
      font-family: 'font-icons';
      color: #257fa4;
      font-size: 18px; }

.options {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column wrap;
  flex-flow: column wrap;
  width: 100%;
  margin-top: 30px; }
  @media screen and (min-width: 576px) {
    .options {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
      flex-flow: row wrap;
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: space-between; } }
  .options .item {
    width: 100%;
    margin-bottom: 15px;
    background-color: rgba(207, 217, 223, 0.9); }
    @media screen and (min-width: 576px) {
      .options .item {
        width: 49%; } }
    @media screen and (min-width: 1200px) {
      .options .item {
        background-color: transparent; } }
    .options .item a {
      border-radius: 4px;
      text-decoration: none;
      display: block;
      width: 100%;
      border: solid 1px rgba(37, 127, 164, 0.8);
      padding: 40px 8px 10px; }
      @media screen and (min-width: 1200px) {
        .options .item a {
          background-color: rgba(37, 127, 164, 0.1); } }
      .options .item a .image img {
        display: block;
        max-width: 100%; }
      .options .item a .title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #257fa4;
        padding-top: 40px; }
        .options .item a .title span {
          border: solid 1px rgba(37, 127, 164, 0.8);
          background-color: #e2e2e4;
          min-width: 28px;
          width: 28px;
          height: 28px;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          font-weight: 700;
          -webkit-box-pack: center;
          -ms-flex-pack: center;
          justify-content: center;
          font-size: 14px; }
        .options .item a .title p {
          color: #257fa4;
          padding-left: 10px;
          font-size: 16px; }
      .options .item a:hover {
        background-color: rgba(37, 127, 164, 0.2); }
        .options .item a:hover .title span {
          position: relative; }
    .options .item.completed .image span {
      position: relative;
      display: block; }
      .options .item.completed .image span::after {
        position: absolute;
        content: "COMPLETADO";
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        border: solid 3px #ffffff;
        padding: 8px 20px;
        color: #ffffff;
        font-size: 20px;
        font-weight: 500;
        background: rgba(0, 0, 0, 0.2); }
    .options .item.play {
      position: relative; }
      .options .item.play a {
        border-width: 2px; }
        .options .item.play a::after {
          position: absolute;
          content: "";
          top: 7px;
          right: 7px;
          display: block;
          width: 50px;
          height: 50px;
          background: url("../images/icon_check.svg") top right no-repeat;
          background-size: 45%;
          z-index: 2; }
      .options .item.play .image span {
        position: relative;
        display: block; }
        .options .item.play .image span::after {
          position: absolute;
          content: "¡JUGAR!";
          top: 50%;
          left: 50%;
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
          border: solid 3px #ffffff;
          padding: 8px 20px;
          color: #ffffff;
          font-size: 20px;
          font-weight: 500;
          background: rgba(0, 0, 0, 0.2); }
      .options .item.play .title span {
        background-color: #257fa4;
        color: #ffffff;
        font-weight: 600; }
        .options .item.play .title span::after {
          background-color: #257fa4 !important;
          color: #ffffff; }
      .options .item.play::after {
        position: absolute;
        content: "";
        top: 0px;
        right: 0px;
        width: 0;
        height: 0;
        border-top: 60px solid #257fa4;
        border-left: 60px solid transparent; }
    .options .item.locked .image span {
      position: relative;
      display: block;
      background-color: #ffffff; }
      .options .item.locked .image span::after {
        position: absolute;
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 60px;
        height: 60px;
        background: url("../images/icon_lock.svg") center center no-repeat;
        background-size: 100%;
        opacity: 0.8; }
      .options .item.locked .image span img {
        opacity: 0.7; }
  .options.nophoto {
    margin-top: 0;
    padding-bottom: 0; }
    .options.nophoto .item {
      width: 100%;
      margin-bottom: 10px;
      max-width: 600px; }
      .options.nophoto .item a {
        padding: 0 8px 6px; }
        .options.nophoto .item a .title {
          padding-top: 6px; }
          .options.nophoto .item a .title p {
            padding-right: 50px; }
            @media screen and (min-width: 768px) {
              .options.nophoto .item a .title p {
                font-size: 18px; } }
      .options.nophoto .item.checked {
        position: relative; }
        .options.nophoto .item.checked a {
          border-width: 2px; }
          .options.nophoto .item.checked a::after {
            position: absolute;
            content: "";
            top: 10px;
            right: 10px;
            width: 50px;
            height: 50px;
            background: url("../images/icon_check_blue.svg") top right no-repeat;
            background-size: 45%; }
          .options.nophoto .item.checked a .title span {
            background-color: #257fa4;
            color: #ffffff;
            font-weight: 600; }
            .options.nophoto .item.checked a .title span::after {
              background-color: #257fa4 !important;
              color: #ffffff; }
  @media screen and (min-width: 576px) {
    .options.inline .item {
      width: 48%; } }
  @media screen and (min-width: 768px) {
    .options.inline {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-flow: column wrap;
      flex-flow: column wrap; }
      .options.inline .item {
        width: 100%; } }
  @media screen and (min-width: 992px) {
    .options.inline {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row wrap;
      flex-flow: row wrap; }
      .options.inline .item {
        width: 48%; } }

.starrr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap; }
  @media screen and (min-width: 576px) {
    .starrr {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
      flex-flow: row nowrap; } }
  .starrr a {
    position: relative;
    cursor: pointer;
    text-decoration: none;
    width: 20%;
    padding-top: 90px; }
    @media screen and (min-width: 576px) {
      .starrr a {
        width: 10%; } }
    .starrr a::before {
      position: absolute;
      font-family: 'font-icons';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      color: #257fa4;
      font-size: 48px; }
    .starrr a::after {
      content: ""; }
  .starrr .star_on::before {
    content: "\e6c1"; }
  .starrr .star_off::before {
    content: "\e68e"; }
  .starrr .star:nth-child(1)::after {
    content: "1";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(2)::after {
    content: "2";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(3)::after {
    content: "3";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(4)::after {
    content: "4";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(5)::after {
    content: "5";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(6)::after {
    content: "6";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(7)::after {
    content: "7";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(8)::after {
    content: "8";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(9)::after {
    content: "9";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }
  .starrr .star:nth-child(10)::after {
    content: "10";
    position: absolute;
    color: #257fa4;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 100%; }

.social_btns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 25px; }
  .social_btns a {
    color: #ffffff;
    width: 35px;
    height: 35px;
    text-decoration: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 3px;
    font-size: 24px; }
    .social_btns a.facebook {
      background-color: #3a559f; }
      .social_btns a.facebook:hover {
        background-color: rgba(58, 85, 159, 0.8); }
    .social_btns a.twitter {
      background-color: #50abf1; }
      .social_btns a.twitter:hover {
        background-color: rgba(80, 171, 241, 0.8); }
    .social_btns a.linkedin {
      background-color: #0084b1; }
      .social_btns a.linkedin:hover {
        background-color: rgba(0, 132, 177, 0.8); }

footer {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #e7e8ea;
  padding: 8px 5px;
  width: 100%;
  border-top: solid 1px #d8d8d8;
   }

  footer p {
    font-size: 10px;
    line-height: 12px;
    color: #444444;
    text-align: center; }
    footer p a {
      color: #257fa4;
      font-weight: 600; }
        
  footer .country-santander{
	padding:10px 0 15px!important;
}
  footer .country-santander a{
	text-decoration:none;
}
  @media screen and (min-width: 576px) {
    footer {
      padding: 10px 20px; }
      footer p {
        font-size: 12px;
        line-height: 14px; } 
	
	}

.step {
  display: none !important; }

.step-1 {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important; }

.step-2 {
  display: none !important; }

.animation-on, .wrapper {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important;
  overflow-y: hidden; }

.add-visibility {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s !important; }

.remove-visibility {
  display: none !important; }

.no-movement {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 0ms ease 0s !important;
  transition: opacity 300ms ease 0s, -webkit-transform 0ms ease 0s !important;
  -o-transition: transform 0ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 0ms ease 0s, opacity 300ms ease 0s !important;
  transition: transform 0ms ease 0s, opacity 300ms ease 0s, -webkit-transform 0ms ease 0s !important; }

.move-to-top-hide {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  opacity: 0;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%); }

.move-to-top-show {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  opacity: 1;
  -webkit-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%); }

.move-to-top-hide2 {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  opacity: 0;
  -webkit-transform: translateY(-200vh);
  -ms-transform: translateY(-200vh);
  transform: translateY(-200vh); }

.move-to-top-show2 {
  -webkit-transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  transition: opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  -o-transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s;
  transition: transform 600ms ease 0s, opacity 300ms ease 0s, -webkit-transform 600ms ease 0s;
  opacity: 1;
  -webkit-transform: translateY(-200vh);
  -ms-transform: translateY(-200vh);
  transform: translateY(-200vh); }

.blink {
  -webkit-animation: blinker 0.3s linear infinite;
  animation: blinker 0.3s linear infinite; }

@-webkit-keyframes blinker {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1; } }

@keyframes blinker {
  0% {
    opacity: 1; }
  50% {
    opacity: 0.5; }
  100% {
    opacity: 1; } }

#cajacookies {
  display: none;
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, 0);
  background-color: #ec0000;
  color: #fff;
  padding: 50px 20px; 
  width: 100%;
  max-width: 750px;
  border-top: solid 1px #d8d8d8; 
  z-index: 999;
}

#cajacookies p {
  font-size: 14px;
  line-height: 14px;
  color: #fff;
  text-align: center;
  margin: 10px;
}
        
#cajacookies p a {
  color: #fff;
  font-weight: 600; 
}
      
@media screen and (max-width: 576px) {     
  #cajacookies {       
    top: 25%;
  }
}

.obligatorio {
  border: 1px solid #ec0000 !important;
}