html{
  background:#f3f2f2;
  font-size:62.5%;
  font-size:70.16%;
}
body{
  overflow:auto;
}
html, body{
  height:100%;
  margin:0;
}

body, input, textarea, select{
  font-family: altivo, sans-serif;
  font-family: 'Arimo', sans-serif;
  font-size:1em;
  color:#ffffff;
}
                
#w{
  position:absolute;
}
#w span{
  width:1px;
  height:1px;
  position:absolute;
  display:none;
}

#page{
  width:100%;
  min-width:480px;
  min-height:100%;
  position:relative;
  background:url(images/bg3.jpg) no-repeat;
  bbackground-attachment:fixed;
  background-size:100% auto;
}
#_page{
  width:1200px;
  background:url(images/kopa.jpg) no-repeat;
  background-image:url(images/bg3.jpg);
}

#side{
  width:50%;
  padding-bottom:63.14%;
}

#side .logos{
  position:absolute;
  top:3.8rem;
  left:7.8rem;
  width:38rem;
  list-style:none;
  padding:0;
  margin:0;
  display:block;
  display:flex;
  justify-content:space-between;
}
#side .logos li{
  display:block;
  text-indent:-999rem;
  background:url(images/spacer.gif) no-repeat center;
  background-size:contain;
}
#side .logos .vivo{
  width:5.7rem;
  height:3rem;
  background-image:url(images/vivo.png);
  background-image:url(images/vivo.svg), none;
}
#side .logos .ostmala{
  width:9.4rem;
  height:2.5rem;
  background-image:url(images/ostmala.png);
  background-image:url(images/ostmala.svg), none;
}
#side .logos .tobago{
  width:9.1rem;
  height:3rem;
  background-image:url(images/tobago.png);
  background-image:url(images/tobago.svg), none;
}
#side .slogan{
  position:absolute;
  top:8.5rem;
  left:6rem;
  width:41.3rem;
  height:14.6rem;
  display:block;
  background:url(images/slogan.png) no-repeat center;
  background-image:url(images/slogan.svg), none;
  background-size:contain;
}
#side .slogan *{
  display:block;
  text-indent:-999rem;
  margin:0;
}

#rats > div{
  position:absolute;
  background:url(images/spacer.gif) no-repeat center;
  background-size:contain;
}
#rats{
  width:30rem;
  height:32rem;
  position:absolute;
  top:24.85rem;
  left:12.03rem;
}
#rats audio{
  position:absolute;
  left:-999em;
  visibility:hidden;
}
#rats .fons{
  width:100%;
  height:100%;
  background-image:url(images/rats/fons.png);
}
@keyframes turn{
  0%{
    transform: rotate(0);
  }
  100%{
    transform: rotate(360deg);
  }
}
#rats .ripa{
  width:25.6rem;
  height:25.6rem;
  left:50%;
  top:50%;
  margin:-12.8rem;
  background-image:url(images/rats/ripa2.png);
}
#rats.turn .ripa{
  animation: turn 2s;
}
#rats .bulta{
  width:100%;
  height:100%;
  background-image:url(images/rats/bulta.png);
}
#rats .centrs{
  width:12.8rem;
  height:12.8rem;
  left:50%;
  top:50%;
  margin:-6.4rem;
  background-image:url(images/rats/centrs2.png);
}
#rats .lampas{
  width:36rem;
  height:36rem;
  margin:-2rem -3rem;
  position:absolute;
  bbackground:rgba(0,0,0,.2);
}
#rats .lampas span{
  width:2.4rem;
  height:2.4rem;
  position:absolute;
  background:url(images/rats/lampa2.png) no-repeat center;
  background-size:contain;
  margin:-1.2rem;
}
#rats .lampas span b{
  width:12.8rem;
  height:12.8rem;
  position:absolute;
  background:url(images/light.png) no-repeat center;
  background-size:contain;
  display:none;
  left:1.2rem;
  top:1.2rem;
  margin:-6.4rem;
}
#rats .lampas span.flash b{
  display:block;
}
#rats .poga{
  width:25.6rem;
  height:25.6rem;
  left:50%;
  top:50%;
  margin:-12.8rem;
  border-radius:50%;
  cursor:pointer;
  _background:rgba(0,255,0,.2);
}



#content{
  width:40%;
  padding:0 4.7% 0 5%;
  position:absolute;
  top:0;
  right:0;
  margin:7% 0 0 0;
}

#menu{
  width:40%;
  position:absolute;
  right:0;
  top:0;
  margin:3.7% 5.5% 0 0;
}
#menu ul{
  list-style:none;
  padding:0;
  margin:0;
  display:block;
  display:flex;
  justify-content:space-between;
}
#menu li{
  display:inline-block;
  vertical-align:top;
  padding:0 .8em;
}
#menu li a{
  font-size:1.6rem;
  font-weight:700;
  color:#858685;
  text-transform:uppercase;
  text-decoration:none;
  display:block;
}
#menu li a:hover,
#menu li a.active{
  color:#ffffff;
}
#menu li a.active{
  border-bottom:2px solid #ffffff;
}


#content .block{
  padding:0;
  position:relative;
}

.select h3{
  font-size:.8rem;
  line-height:2rem;
  color:#FFFFFF;
  margin:0;
  text-align:left;
  text-transform:uppercase;
  display:inline-block;
}
.select.err h3{
  _color:#af2c2e;
}
.select ul{
  white-space:nowrap;
  display:inline-block;
}
.select li{
  width:auto;
  display:inline-block;
  vertical-align:top;
  margin:0;
}
.select input{
  display:none;
}
.select label{
  width:3.3rem;
  height:1.7rem;
  display:block;
  position:relative;
  margin-left:3.5rem;
}
.select label span{
  width:100%;
  height:100%;
  display:block;
  background:url(images/spacer.gif) no-repeat center center;
  background-size:contain;
  position:absolute;
  transform:scale(1);
  cursor:pointer;
  transition:transform .2s;
}
.select label span:hover{
  _transform:scale(1.2);
}
.select input[value="vivo"] + label span{
  background-image:url(images/vivo.png);
  background-image:url(images/vivo.svg), none;
}
.select input[value="ostmala"] + label{
  width:5.8rem;
  height:1.5rem;
}
.select input[value="ostmala"] + label span{
  background-image:url(images/ostmala.png);
  background-image:url(images/ostmala.svg), none;
}
.select input[value="tobago"] + label{
  width:5.3rem;
  height:1.7rem;
}
.select input[value="tobago"] + label span{
  background-image:url(images/tobago.png);
  background-image:url(images/tobago.svg), none;
}
.select label::before,
.select label::after{
  content:'';
  position:absolute;
  left:-2.5rem;
  margin:0;
  width:1.8rem;
  height:1.8rem;
  display:block;
  position:absolute;
  border:2px solid #ffffff;
}
.select label::after{
  border:0;
  padding:2px;
  background-image:url(images/select.png);
  background-image:url(images/select.svg), none;
  display:none;
}
.select input:checked + label::after{
  display:block;
}


#content .register{
  padding-top:1rem;
}
#content .register.done{
  padding:14% 7% 0 0;
}
#content .register.done form{
  display:none;
}
#content .register ul{
	list-style:none;
  padding:0;
  margin:0;
}
#content .register ul.steps{
  width:41.5rem;
  height:11.4rem;
  background:url(images/reg_steps.png) no-repeat center;
  background-image:url(images/reg_steps.svg), none;
  background-size:contain;
}
#content .register.done ul.steps{
  display:none;
}
#content .register ul.steps li{
  text-indent:-999em;
}
#content .register form{
  width:41.5rem;
  margin-top:2rem;
  padding-top:1rem;
  border-top:1px solid #ffffff;
}
#content .register ul li{
  width:100%;
  display:block;
  margin:0 0 .85rem 0;
  position:relative;
}
#content .register ul li.no-margin{
  margin:0;
}
#content .register ul li.select{
  margin-bottom:2.5rem;
}
#content .register ul li.select ul{
  white-space:nowrap;
  display:inline-block;
}
#content .register ul li.select li{
  width:auto;
  display:inline-block;
  vertical-align:top;
  margin:0;
}
#content .register ul li.select.err label::before{
  border-color:#af2c2e;
  background:#ffffff;
}
#content .register ul li.select input:checked + label::before{
  background:none;
}
#content .register ul li.select.err h3{
  _color:#af2c2e;
}
#content .register ul li.check{
  width:100%;
  padding:0;
  white-space:nowrap;
}
#content .register ul li.check input{
  display:none;
}
#content .register ul li.check label{
  font-size:.8rem;
  line-height:1.8rem;
  font-weight:400;
  color:#ffffff;
  display:inline-block;
  margin:0 0 0 3rem;
  vertical-align:middle;
  white-space:normal;
  position:relative;
}
#content .register ul li.check label a{
  color:#ffffff;
  text-decoration:underline;
}
#content .register ul li.check label a:hover{
  text-decoration:none;
}
#content .register ul li.check label::before,
#content .register ul li.check label::after{
  content:'';
  position:absolute;
  top:0;
  left:-2.5rem;
  margin:0;
  width:1.8rem;
  height:1.8rem;
  display:block;
  position:absolute;
  border:2px solid #ffffff;
}
#content .register ul li.check label::after{
  border:0;
  padding:2px;
  background-image:url(images/select.png);
  background-image:url(images/select.svg), none;
  display:none;
}
#content .register ul li.check.err label::before{
  border-color:#af2c2e;
  background:#ffffff;
}
#content .register ul li.check input:checked + label::before{
  background:none;
}
#content .register ul li.check input:checked + label::after{
  display:block;
}

#content .register .thanks{
  font-size:1.4rem;
  line-height:120%;
  color:#ffffff;
  padding:0;
  margin:0 auto;
  position:relative;
  display:none;
}
#content .register .thanks h2{
  width:28.4rem;
  height:7.7rem;
  text-indent:-999em;
  margin:0 0 0 -2rem;
  background:url(images/thanks.png) no-repeat center;
  background-size:contain;
  display:block;
}
#content .register .thanks b{
  font-size:1.8rem;
}
#content .register.done .thanks{
  display:block;
}

#content .register .off{
  font-size:0;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:url(images/register_off.png) no-repeat center;
  background-size:contain;
  display:none;
}
#content .register.off .off{
  display:block;
}

.textfield{
  width:100%;
  height:2rem;
  border:1px solid #ffffff;
  padding:0;
  margin:0;
  position:relative;
  display: flex;
  align-items:flex-end;
}
.err .textfield{
  background:#FFFFFF;
  border-color:#FF002E;
}
.textfield label,
.textfield input{
  font-size:1.4rem;
  line-height:2rem;
  height:2rem;
  font-weight:400;
  color:#ffffff;
  text-align:left;
  padding:0 .6rem;
}
.textfield input{
  background:none;
  padding-left:0;
  border:0;
  margin:0;
  flex-grow:1;
}
/* Change Autocomplete styles in Chrome*/
.textfield input:-webkit-autofill,
.textfield input:-webkit-autofill:hover, 
.textfield input:-webkit-autofill:focus{
  font-size: 1.4em !important;
  -webkit-text-fill-color: #ffffff;
  -webkit-box-shadow: 0 0 0px 1000px #8E0617 inset;
  transition: background-color 5000s ease-in-out 0s;
}
.focus .textfield input{
  -webkit-text-fill-color:#ffffff;
  color:#ffffff;
}
.err .textfield label,
.err .textfield input{
  -webkit-text-fill-color:#FF002E;
  color:#FF002E;
}
/* Change Autocomplete styles in Chrome*/
.err .textfield input:-webkit-autofill,
.err .textfield input:-webkit-autofill:hover, 
.err .textfield input:-webkit-autofill:focus{
  -webkit-text-fill-color: #FF002E;
  -webkit-box-shadow: 0 0 0px 1000px #FFFFFF inset;
}

div.choose{
  width:100%;
  height:2rem;
  border:1px solid #ffffff;
  padding:0;
  margin:0;
  position:relative;
  display:flex;
  align-items:flex-end;
}
div.choose input{
  position:absolute;
  left:-999em;
}
div.choose label,
div.choose span{
  display:inline-block;
  vertical-align:top;
}
div.choose span{
  font-size:1rem;
  line-height:2rem;
  height:2rem;
  font-weight:400;
  color:#ffffff;
  flex-grow:1;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  padding:0 1rem;
  text-align:left;
  text-decoration:none;
  border:0;
  margin:0;
  background:none;
  ddisplay:block;
}
div.choose label{
  font-size:1.3rem;
  line-height:2rem;
  height:2rem;
  font-weight:400;
  color:#FFFFFF;
  cursor:pointer;
  padding:0 .6rem;
  white-space:nowrap;
}
div.choose label.button{
  font-size:1rem;
  line-height:2rem;
  height:2rem;
  font-weight:400;
  color:#FFFFFF;
  cursor:pointer;
  padding:0 1rem;
  border-left:1px solid #ffffff;
  background:#F18905;
}

.submit{
  display:inline-block;
  margin:.5rem 0 0 0;
  position:relative;
}
._submit input{
  font-family:'Bely Display', sans-serif;
  font-family: bely-display, sans-serif;
  font-size:1.5rem;
  line-height:3.5rem;
  color:#000000;
  text-align:center;
  font-weight:400;
  padding:0 1rem;
  display:block;
}
.submit input{
  text-indent:-999rem;
  width:24rem;
  height:3.6rem;
  background:#FB8E03 url(images/submit.png) no-repeat center;
  background-image:url(images/submit.svg), none;
  background-size:contain;
  border:1px solid #FFFFFF;
  cursor:pointer;
-webkit-appearance: none;
}
._submit input:active{
  color:#ffffff;
  text-shadow:0 0 .5rem #F3F3F8;
}
.submit input:active{
  background-color:#970619;
  background-image:url(images/submit_active.png);
  background-image:url(images/submit_active.svg), none;
}
form.wait .submit input{
  opacity:.5;
}
.submit div{
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  background:url(images/spinner_white.gif) no-repeat center center;
  background-image:url(images/spinner_white.svg), none;
  background-size:contain;
  cursor:default;
  display:none;
}
form.wait .submit div{
  display:block;
}



div.alert{
  text-align:left;
  margin:0 40% 0 0;
}
div.alert div{
  font-size:1rem;
  line-height:120%;
  color:#ffffff;
  text-transform:uppercase;
  display:none;
  vertical-align:top;
}
div.alert div::before{
  content:'';
  width:2rem;
  height:2rem;
  position:absolute;
  top:-.4rem;
  left:-2.5rem;
  background:url(images/err.png) no-repeat center;
  background-image:url(images/err.svg), none;
  background-size:contain;
}
div.alert.on div{
  display:inline-block;
}


#content .winners{
}
.winners.opened .menu,
.winners .raffles{
  display:none;
}
.winners.opened .raffles{
  display:block;
}
.winners .menu{
}
.winners .menu ul{
  list-style:none;
  margin:2rem 0 0 0;
  padding:0;
  text-align:center;
}
.winners .menu li{
  width:16rem;
  height:10rem;
  line-height:10rem;
  display:inline-block;
  vertical-align:top;
  margin:1rem 1rem;
  position:relative;
  border:1px solid #ffffff;
}
.winners .menu a,
.winners .menu span{
  width:100%;
  font-size:1.3rem;
  line-height:120%;
  color:#FFFFFF;
  font-weight:400;
  text-decoration:none;
  position:relative;
  display:inline-block;
  vertical-align:middle;
}
.winners .menu h4{
  font-family: altivo, sans-serif;
  font-size:2.4rem;
  line-height:120%;
  font-weight:700;
  margin:0 0 .5rem 0;
}
.winners .menu a:active{
}
.winners .menu span{
  cursor:default;
  opacity:.7;
}

.winners .raffles .select{
  padding-bottom:1rem;
  margin-bottom:.8rem;
  border-bottom:1px solid #ffffff;
}
.winners .raffles .select ul{
  list-style:none;
  margin:0;
  padding:0;
}
.winners .raffles .select label{
  margin-left:4.3rem;
}
.winners .raffles .select label span{
  opacity:.33;
}
.winners .raffles .select input:checked + label span{
  opacity:1;
}
.winners .raffles .select label::before,
.winners .raffles .select label::after{
  opacity:.33;
}
.winners .raffles .select label::after{
  background-image:url(images/select_check.png);
  background-image:url(images/select_check.svg), none;
}
.winners .raffles .select input:checked + label::before,
.winners .raffles .select input:checked + label::after{
  opacity:1;
}

.winners .raffles ul{
  list-style:none;
  margin:0;
  padding:0;
  text-align:left;
}
.winners .raffles ul.list{
  display:none;
  margin-right:-.8rem;
  font-size:0;
  min-height:36.5rem;
}
._winners .raffles ul.list{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-content:space-between;
  gap:.8rem;
}
.winners .raffles ul.list li{
  width:12.2rem;
  padding:.5rem;
  font-size:1.1rem;
  line-height:120%;
  color:#ffffff;
  text-align:center;
  border:1px solid #ffffff;
  display:inline-block;
  margin:0 .8rem .8rem 0;
}
.winners .raffles ul.list li h4{
  margin:0;
}
.winners .raffles ul.list li .sm{
  font-size:1rem;
  line-height:120%;
  display:block;
}

.winners .raffles .pages{
  display:none;
}
.winners .raffles .pages a{
  font-size:1.1rem;
  line-height:2.4rem;
  color:#ffffff;
  text-decoration:none;
  padding:0 1rem;
  border:1px solid #ffffff;
  display:inline-block;
  margin:0 .5rem 0 0;
}



#content .rules{
  padding:2rem 0 0 0;
}
#content .rules ol{
  columns:2;
  padding:0 0 1rem 0;
  margin:0;
  list-style-position: inside;
  border-bottom:1px solid #ffffff;
}
#content .rules li{
  font-size:1rem;
  line-height:125%;
  color:#ffffff;
  font-weight:400;
  text-align:justify;
  padding:0 5% 3% 2%;
}
#content .rules a{
  color:#ffffff;
  font-weight:bold;
  text-decoration:underline;
}
#content .rules a:hover{
  text-decoration:none;
}
#content .rules small{
  font-size:.9rem;
  line-height:125%;
  color:#ffffff;
  font-weight:400;
  display:block;
  margin-top:1.5rem;
}



form{
  margin:0;
}
.left{
  float:left;
}
.right{
  float:right;
}
.clear{
  clear:both;
  height:1px;
  overflow:hidden;
  display:block;
}

sup, sub{
	height: 0;
	line-height: 0;
	vertical-align: baseline;
	position: relative;
}
sup{
	bottom: 1.5ex;
  font-size:55%;
}
sub{
	top: .5ex;
  font-size:65%;
}

input:focus, textarea:focus, select:focus{
  outline: none;
  outline-width:0;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);    
  -webkit-user-modify: read-write-plaintext-only;
}
textarea{
  resize: none;
}
@-webkit-keyframes autofill {
    to {
        color: #666;
        background: transparent;
    }
}
input:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}