/* lato-regular - latin */
@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/lato-v22-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
  }
  /* lato-italic - latin */
  @font-face {
    font-family: 'Lato';
    font-style: italic;
    font-weight: 400;
    src: url('fonts/lato-v22-latin-italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-italic.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-italic.svg#Lato') format('svg'); /* Legacy iOS */
  }
  /* lato-700 - latin */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 700;
    src: url('fonts/lato-v22-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-700.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-700.svg#Lato') format('svg'); /* Legacy iOS */
  }
  /* lato-700italic - latin */
  @font-face {
    font-family: 'Lato';
    font-style: italic;
    font-weight: 700;
    src: url('fonts/lato-v22-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-700italic.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-700italic.svg#Lato') format('svg'); /* Legacy iOS */
  }
  /* lato-900 - latin */
  @font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 900;
    src: url('fonts/lato-v22-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-900.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-900.svg#Lato') format('svg'); /* Legacy iOS */
  }
  /* lato-900italic - latin */
  @font-face {
    font-family: 'Lato';
    font-style: italic;
    font-weight: 900;
    src: url('fonts/lato-v22-latin-900italic.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('fonts/lato-v22-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/lato-v22-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
         url('fonts/lato-v22-latin-900italic.woff') format('woff'), /* Modern Browsers */
         url('fonts/lato-v22-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
         url('fonts/lato-v22-latin-900italic.svg#Lato') format('svg'); /* Legacy iOS */
  }


h1 {
    text-align: center;
}








/* 
::-webkit-scrollbar {
    width: 1em;
    height: 1em
}
::-webkit-scrollbar-button {
    background: #ccc
}
::-webkit-scrollbar-track-piece {
    background: rgb(228, 228, 228)
}
::-webkit-scrollbar-thumb {
    background: #3ec684;
    border-radius: 8px;
}
 */






html{ height: 100%; background: #f2f2f2; overflow: hidden;}
body{background: #005AD2; max-width: 1080px; margin: 0 auto; height: 1920px; font-family: 'Lato', sans-serif; font-size: 24px!important; position: relative; display: flex; flex-direction: column; overflow: hidden;}

h1{font-size: 96px; font-weight: 900; font-style: italic; color: #fff; margin: 0 0 32px 0; line-height: 1.2;}
h2{font-size: 64px; font-weight: 700; font-style: italic; color: #fff; margin: 0}
h2 span{font-weight: 900; display: block; color: #FFCC29; font-size: 64px;}

header{text-align: center; background: #fff;}
header .cont > img{width: 660px;}
header .cont {padding-top: 32px; padding-bottom: 32px}

.container {padding: 60px 0 0 0; position: relative; flex-grow: 1; width: 100%;}
.container .cont-header{ text-align: center;}

.container .cont-header-alert{ text-align: center; display: none;  }
.container .cont-header-alert .btn{max-width: 200px; margin-top: 120px;}

.container .cont-header-winner{ text-align: center; display: none; position: absolute; width: 100%;  }
.container .cont-header-amarillo{ text-align: center; display: none; position: absolute; width: 100%;  }
.container .cont-header-suerte{ text-align: center; display: none; position: absolute; width: 100%; top: 0; }
.container .cont-header-amarillo h1{font-size: 72px; color: #005AD2;}
.container .cont-header-amarillo h2{font-size: 56px; color: #005AD2}


main {flex:2;  display: flex; align-items: center; flex-direction: column; justify-content: space-between;}
main > .container{margin: auto}

.semaforo {position: absolute; bottom: 0; width: 400px;  overflow: hidden; left: 60px}
.semaforo img{height: auto;}

.semaforo-anim img{display: none; width: 100%;}
.semaforo-anim img#s01{display: block;}

.cont-form{width: 420px; margin-left: 520px; margin-top: 180px;}

form input{border-radius: 16px; width: 100%; font-size: 32px;}
form input[type="text"]{background: #fff; padding: 16px 24px; border: none}
form a{color: #fff}

form label{display: block; font-size: 24px; color: #fff; text-transform: uppercase; margin-bottom: 8px; font-weight: 900; letter-spacing: .05en;}

.form-item{padding-bottom: 32px;}

.form-item .btn{width: 100%; font-size: 32px; text-align: center; padding: 16px; margin-top: 32px; border-radius: 16px; font-weight: 900; text-transform: uppercase;}
.form-item .btn.btn-primary{background-color: #FFCC29; color: #005AD2;}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle{background-color: #fcff55; color: #005AD2;}

.alert{font-size: 32px; line-height: 1.4; border: 2px solid; margin-bottom: 32px; display: none;}


.hg-theme-default .hg-button{height: 101px; font-size: 1.8rem;}
.hg-theme-default.hg-layout-numeric .hg-button{height: 101px; font-size: 1.8rem;}

.festejos{width: 100%; height: 100%; position: absolute; z-index: 1000; background: #005AD2; display: flex;}
.festejos .container{text-align: center; margin: auto; max-width: 780px; padding: 0;}
.festejos .container img{margin-bottom: 80px;}
.festejos h2{margin-top: 240px;}
.confetti-container{width: 100%; height: 100%; position: absolute; z-index: 1000; display: none;}


.color {
  fill: var(--color, black);
}

.festejos #svg {
  position: absolute;
  overflow: visible;
  top: 0;
  left: 0;
}

.festejos #content {
  text-align: center;
  font-family: sans-serif;
  user-select: none;
}

.festejos .balloon {
  cursor: pointer;
}

.festejos #behind_svg {
  z-index: 1;
}
.festejos #content {
  z-index: 2;
}
.festejos #svg {
  z-index: 3; transform: scale(120%);
}



