* {
  margin: 0;
  padding: 0;
  border: 0;
}

@font-face {
    font-family: 'Manrope-Bold';
    src: url('../fonts/Manrope-Bold.eot');
    src: url('../fonts/Manrope-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Manrope-Bold.woff2') format('woff2'),
        url('../fonts/Manrope-Bold.woff') format('woff'),
        url('../fonts/Manrope-Bold.ttf') format('truetype'),
        url('../fonts/Manrope-Bold.svg#Manrope-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope-Regular.eot');
    src: url('../fonts/Manrope-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Manrope-Regular.woff2') format('woff2'),
        url('../fonts/Manrope-Regular.woff') format('woff'),
        url('../fonts/Manrope-Regular.ttf') format('truetype'),
        url('../fonts/Manrope-Regular.svg#Manrope-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Manrope-Ligth';
    src: url('../fonts/Manrope-Light.eot');
    src: url('../fonts/Manrope-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Manrope-Light.woff2') format('woff2'),
        url('../fonts/Manrope-Light.woff') format('woff'),
        url('../fonts/Manrope-Light.ttf') format('truetype'),
        url('../fonts/Manrope-Light.svg#Manrope-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

.h50vh{
  height: 50vh;
}
.h75vh{
  height: 75vh;
}
html, body {
  height: 100%;
  font-family: 'Manrope' !important;
}
header{
  z-index: 999;
}
#top-menu li a img{
    width: 100px;
  }
strong{
  font-family: 'Manrope-Bold' !important;
}
.Manrope-Ligth{
  font-family: 'Manrope-Ligth' !important;
}
section::before {
    height: 56px;
    content: "";
    display:block;
}
h1{
  font-size: 2.8rem !important;
}
.font-light{
  font-family: 'Manrope-Light' !important;
}

.new-spirit-bold{
  font-family: new-spirit, serif !important;
  font-weight: 700;
  font-style: normal;
}

.hidden{
  display: none;
}
.pointer{
  cursor: pointer;
}
.p-6{
  padding: 4rem!important;
}
.mb-6{
  margin-bottom: 4rem!important;
}
.mb-7{
  margin-bottom: 5rem!important;
}
.mb-8{
  margin-bottom: 6rem!important;
}
.mb-9{
  margin-bottom: 7rem!important;
}
.mb-10{
  margin-bottom: 8rem!important;
}
.h100vh{
  height: 100vh;
}
.h40vh{
  height: 40vh;
}
.h50vh{
  height: 50vh;
}
.h60vh{
  height: 60vh;
}
.font-10{
  font-size: 10px;
}
.font-12{
  font-size: 12px;
}
.font-14{
  font-size: 14px;
}
.font-16{
  font-size: 16px;
}
.font-18{
  font-size: 18px;
}
.font-20{
  font-size: 20px;
}
.font-22{
  font-size: 22px;
}
.font-24{
  font-size: 24px;
}
.font-36{
  font-size: 36px;
}
.font-48{
  font-size: 48px;
}
.font-54{
  font-size: 54px;
}
.font-60{
  font-size: 60px;
}
.middle{
  display: flex;
    align-items: center;
}
.middle-middle{
  justify-content: center;
}
.middle-left{
  justify-content: left;
}
.middle-right{
  justify-content: flex-end;
}
.middle-bottom{
  display: flex;
    align-items: flex-end !important;
}

::placeholder {
  color: #000;
  opacity: 1; /* Firefox */
}

::-ms-input-placeholder { /* Edge 12-18 */
  color: #000;
}

body {
  font-family: sans-serif;
  background: #64e9f7;
}

.bg-main{
  background: #64e9f7 !important;
}
.bg-bluelight{
  background: #e6f4f5 !important;
}
.bg-yellow{
  background: #f4d452 !important;
}
.bg-destellos{
  background: url(../img/destellos-img.png?v=1.0) no-repeat center;
  background-size: cover;
}
.bg-lightning{
  background-image: url(../img/game-bg.png?v=1.0), linear-gradient(rgba(255,255,255,1), rgba(100,243,247,.5));
  background-size: cover;
  background-position: center;
}
.bg-trophy{
  background-image: linear-gradient(rgba(255,255,255,1), rgba(100,243,247,.5)), url(../img/copas-bg.png);
  background-size: cover;
  background-position: center;
}
.bg-grad{
  background-image: linear-gradient(rgba(255,255,255,1), rgba(100,243,247,.5)) !important;
}

.logos{
  height: 55px;
}
.info-btn{
  width: 25px;
  height: 25px;
  top: 16px;
  right: 20px;
}
.circle-number{
  position: relative;
  width: 50px;
  height: 50px;
}
.circle-number-rline{
  position: absolute;
  width: 50%;
  height: 1px;
  border: 1px solid #000;
  left: 50%;
  top: 25px;
}
.circle-number-lline{
  position: absolute;
  width: 50%;
  height: 1px;
  border: 1px solid #000;
  right: 50%;
  top: 25px;
}
.home-subtitle{
    top: -20px;
  }
  .show480{
    display: none;
  }
/* GAME STYLES */
.game {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 330px;
    height: 490px;
    border-radius: 9px;
    background-color: #333;
    padding: 5px;

}

.box {
    height: 80px;
    width: 80px;
    float: left;
    margin: 0;
    padding: 0px;
    text-align: center;
    border-radius: 9px;
    border: 4px solid #333;
    background-color: #f1c97c;

    background-position: center;
    background-size: 70%;
    background-repeat: no-repeat;

}

.green {
    background-color: var(--green);
    animation-name: getIn;
    animation-duration: .3s;
    animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.tree {
    background-image: url('../img/icono.png');
    background-size: 85%;
    background-color: #64e9f7;
    background-position: center;
    background-repeat: no-repeat;
}

.red {
    background-color: var(--red);
    animation-name: getIn1;
    animation-duration: .3s;
    animation-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.factory {
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNTEyLjAwMSA1MTIuMDAxIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIuMDAxIDUxMi4wMDE7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIHN0eWxlPSJmaWxsOiNFM0UzRTM7IiBkPSJNMzc5LjAwMSwzMzguODc2di04MC4xMmwtMTIzLDgwdi04MGwtMTE2LjUsNzUuNjhsLTkuNTYtMTE4LjU2aC05Ni42MWwtMC4yNi0wLjAybC0xOS44NCwyNDYuMDENCgljMC4wOTcsMC4wMSwwLjEsMC4wMSwwLjEsMC4wMWwtMC4xLTAuMDFsLTMuMjMsNDAuMDFoMTQzaDM0OXYtMjQzTDM3OS4wMDEsMzM4Ljg3NnogTTE0OS42NzEsNDYxLjg3NkwxNDkuNjcxLDQ2MS44NzZsMC4xLTAuMDENCglMMTQ5LjY3MSw0NjEuODc2eiIvPg0KPGc+DQoJPHJlY3QgeD0iMzk5LjAwMSIgeT0iMzc4Ljg3MSIgc3R5bGU9ImZpbGw6IzREQkJFQjsiIHdpZHRoPSI2MyIgaGVpZ2h0PSI0MCIvPg0KCTxyZWN0IHg9IjI5Ni4wMDEiIHk9IjM3OC44NzEiIHN0eWxlPSJmaWxsOiM0REJCRUI7IiB3aWR0aD0iNjMiIGhlaWdodD0iNDAiLz4NCgk8cmVjdCB4PSIxOTYuMDAxIiB5PSIzNzguODcxIiBzdHlsZT0iZmlsbDojNERCQkVCOyIgd2lkdGg9IjYwIiBoZWlnaHQ9IjQwIi8+DQo8L2c+DQo8Zz4NCgk8cGF0aCBzdHlsZT0iZmlsbDojRkQ2MjQ0OyIgZD0iTTE0OS43NzEsNDYxLjg2NmwzLjIzLDQwLjAxaC0xNDNsMy4yMy00MC4wMWMwLjE1MiwwLjAxNSwxMzYuMjg3LDAuMDEsMTM2LjQ0LDAuMDFMMTQ5Ljc3MSw0NjEuODY2DQoJCXoiLz4NCgk8cG9seWdvbiBzdHlsZT0iZmlsbDojRkQ2MjQ0OyIgcG9pbnRzPSIxMjYuNDcxLDE3Mi44NjYgMTI5Ljk0MSwyMTUuODc2IDMzLjMzMSwyMTUuODc2IDMzLjA3MSwyMTUuODU2IDM2LjUzMSwxNzIuODY2IA0KCQkzNi42NzEsMTcyLjg3NiAxMjYuMzMxLDE3Mi44NzYgCSIvPg0KPC9nPg0KPHBvbHlnb24gc3R5bGU9ImZpbGw6I0UzRTNFMzsiIHBvaW50cz0iMTIzLjAwMSwxMjkuODc2IDEyNi40NzEsMTcyLjg2NiAxMjYuMzMxLDE3Mi44NzYgMzYuNjcxLDE3Mi44NzYgMzYuNTMxLDE3Mi44NjYgDQoJNDAuMDAxLDEyOS44NzYgIi8+DQo8cGF0aCBkPSJNMTk2LjAwMSw0NTEuODc2Yy01LjUyLDAtMTAsNC40OC0xMCwxMHM0LjQ4LDEwLDEwLDEwczEwLTQuNDgsMTAtMTBTMjAxLjUyMSw0NTEuODc2LDE5Ni4wMDEsNDUxLjg3NnoiLz4NCjxwYXRoIGQ9Ik01MDYuNzcsMjUwLjA4NmMtMy4yMjYtMS43NDktNy4xNDctMS41OTItMTAuMjIxLDAuNDA3bC0xMDcuNTQ4LDY5Ljk1di02MS42ODdjMC0zLjY2Ny0yLjAwOC03LjA0MS01LjIzMS04Ljc5DQoJYy0zLjIyNS0xLjc0OC03LjE0Ni0xLjU5Mi0xMC4yMjEsMC40MDdsLTEwNy41NDgsNjkuOTV2LTYxLjU2N2MwLTMuNjY2LTIuMDA3LTcuMDM5LTUuMjI5LTguNzg5DQoJYy0zLjIyMi0xLjc0OS03LjE0NC0xLjU5Ni0xMC4yMTgsMC40MDNsLTEwMi40MzYsNjYuNTQ0Yy0wLjU3OC03LjE3Mi0xNS4wMDktMTg2LjEwOC0xNS4xNDktMTg3Ljg0Mw0KCWMtMC40MTktNS4xOTQtNC43NTctOS4xOTUtOS45NjgtOS4xOTVoLTgzYy01LjIxMSwwLTkuNTQ5LDQuMDAxLTkuOTY4LDkuMTk1bC0zMCwzNzJjLTAuMjI1LDIuNzgzLDAuNzI1LDUuNTMzLDIuNjE4LDcuNTg1DQoJczQuNTU4LDMuMjE5LDcuMzUsMy4yMTljNi40NzksMCw0NjEuMTQ4LDAsNDkyLDBjNS41MjIsMCwxMC00LjQ3NywxMC0xMHYtMjQzQzUxMi4wMDEsMjU1LjIwOSw1MDkuOTkzLDI1MS44MzUsNTA2Ljc3LDI1MC4wODZ6DQoJIE0xMTkuMDk4LDIwNS44NzZINDMuOTA1bDEuODU1LTIzaDcxLjQ4NEwxMTkuMDk4LDIwNS44NzZ6IE00Mi4yOTIsMjI1Ljg3Nmg3OC40MTljMC42OTEsOC41NjMsMTcuMjUxLDIxMy45MjIsMTguMjI1LDIyNkgyNC4wNjcNCglMNDIuMjkyLDIyNS44NzZ6IE0xMTMuNzc2LDEzOS44NzZsMS44NTUsMjNINDcuMzcybDEuODU1LTIzSDExMy43NzZ6IE0yMC44NDEsNDkxLjg3NmwxLjYxMy0yMGgxMTguMDk1bDEuNjEzLDIwSDIwLjg0MXoNCgkgTTQ5Mi4wMDEsNDkxLjg3NkgxNjIuMjI3bC0xMi4yODItMTUyLjNsOTYuMDU2LTYyLjM5OXY2MS41NzljMCwzLjY2NywyLjAwOCw3LjA0MSw1LjIzMSw4Ljc5DQoJYzMuMjI2LDEuNzQ5LDcuMTQ3LDEuNTkzLDEwLjIyMS0wLjQwN2wxMDcuNTQ4LTY5Ljk1djYxLjY4N2MwLDMuNjY3LDIuMDA4LDcuMDQxLDUuMjMxLDguNzljMy4yMjMsMS43NDcsNy4xNDYsMS41OTMsMTAuMjIxLTAuNDA3DQoJbDEwNy41NDgtNjkuOTVWNDkxLjg3NnoiLz4NCjxwYXRoIGQ9Ik0xOTYuMDAxLDQyOC44NzZoNjBjNS41MjIsMCwxMC00LjQ3NywxMC0xMHYtNDBjMC01LjUyMy00LjQ3OC0xMC0xMC0xMGgtNjBjLTUuNTIyLDAtMTAsNC40NzctMTAsMTB2NDANCglDMTg2LjAwMSw0MjQuMzk5LDE5MC40NzksNDI4Ljg3NiwxOTYuMDAxLDQyOC44NzZ6IE0yMDYuMDAxLDM4OC44NzZoNDB2MjBoLTQwVjM4OC44NzZ6Ii8+DQo8cGF0aCBkPSJNMjk2LjAwMSw0MjguODc2aDYzYzUuNTIyLDAsMTAtNC40NzcsMTAtMTB2LTQwYzAtNS41MjMtNC40NzgtMTAtMTAtMTBoLTYzYy01LjUyMiwwLTEwLDQuNDc3LTEwLDEwdjQwDQoJQzI4Ni4wMDEsNDI0LjM5OSwyOTAuNDc5LDQyOC44NzYsMjk2LjAwMSw0MjguODc2eiBNMzA2LjAwMSwzODguODc2aDQzdjIwaC00M1YzODguODc2eiIvPg0KPHBhdGggZD0iTTM5OS4wMDEsNDI4Ljg3Nmg2M2M1LjUyMiwwLDEwLTQuNDc3LDEwLTEwdi00MGMwLTUuNTIzLTQuNDc4LTEwLTEwLTEwaC02M2MtNS41MjIsMC0xMCw0LjQ3Ny0xMCwxMHY0MA0KCUMzODkuMDAxLDQyNC4zOTksMzkzLjQ3OSw0MjguODc2LDM5OS4wMDEsNDI4Ljg3NnogTTQwOS4wMDEsMzg4Ljg3Nmg0M3YyMGgtNDNWMzg4Ljg3NnoiLz4NCjxwYXRoIGQ9Ik01NC4wMDEsNzkuODc2YzUuNTIyLDAsMTAtNC40NzcsMTAtMTBjMC0xNi41NDIsMTMuNDU4LTMwLDMwLTMwaDEyMmM4LjAzMiwwLDE1Ljg3Mi0zLjI3MSwyMS41MDktOC45NzUNCgljNS41NjgtNS42MzUsOC41ODMtMTMuMDU1LDguNDktMjAuODk0Yy0wLjA2NC01LjQ4Mi00LjUyOC05Ljg4MS05Ljk5Ny05Ljg4MWMtMC4wMzksMC0wLjA4LDAtMC4xMiwwDQoJYy01LjUyMiwwLjA2Ni05Ljk0Niw0LjU5Ni05Ljg4MSwxMC4xMThjMC4wMjksMi40NTItMC45MzcsNC43OTUtMi43MTksNi41OThjLTEuOTA0LDEuOTI4LTQuNTU5LDMuMDMzLTcuMjgyLDMuMDMzaC0xMjINCgljLTI3LjU3LDAtNTAsMjIuNDMtNTAsNTBDNDQuMDAxLDc1LjM5OSw0OC40NzksNzkuODc2LDU0LjAwMSw3OS44NzZ6Ii8+DQo8cGF0aCBkPSJNMjM1Ljk5LDU5Ljc1NmwtMTExLjk4OSwwLjEyYy0xNi41NDIsMC0zMCwxMy40NTgtMzAsMzBjMCw1LjUyMyw0LjQ3OCwxMCwxMCwxMHMxMC00LjQ3NywxMC0xMGMwLTUuNTE0LDQuNDg2LTEwLDEwLjAxMS0xMA0KCWwxMTEuOTg5LTAuMTJjMTYuNTQyLDAsMzAtMTMuMjQzLDMwLTI5LjUydi0wLjIzYzAtNS41MjMtNC40NzgtMTAtMTAtMTBzLTEwLDQuNDc3LTEwLDEwdjAuMjMNCglDMjQ2LjAwMSw1NS40ODUsMjQxLjUxNSw1OS43NTYsMjM1Ljk5LDU5Ljc1NnoiLz4NCjxwYXRoIGQ9Ik00NjIuMDAxLDQ1MS44NzZoLTIyNmMtNS41MjIsMC0xMCw0LjQ3Ny0xMCwxMHM0LjQ3OCwxMCwxMCwxMGgyMjZjNS41MjIsMCwxMC00LjQ3NywxMC0xMFM0NjcuNTI0LDQ1MS44NzYsNDYyLjAwMSw0NTEuODc2DQoJeiIvPg0KPHBhdGggZD0iTTcwLjAwMSwyODguODc2aDIzYzUuNTIyLDAsMTAtNC40NzcsMTAtMTBzLTQuNDc4LTEwLTEwLTEwaC0yM2MtNS41MjIsMC0xMCw0LjQ3Ny0xMCwxMFM2NC40NzksMjg4Ljg3Niw3MC4wMDEsMjg4Ljg3NnoiLz4NCjxwYXRoIGQ9Ik03MC4wMDEsMzI4Ljg3NmgyM2M1LjUyMiwwLDEwLTQuNDc3LDEwLTEwcy00LjQ3OC0xMC0xMC0xMGgtMjNjLTUuNTIyLDAtMTAsNC40NzctMTAsMTBTNjQuNDc5LDMyOC44NzYsNzAuMDAxLDMyOC44NzZ6Ii8+DQo8cGF0aCBkPSJNNzAuMDAxLDM2OC44NzZoMjNjNS41MjIsMCwxMC00LjQ3NywxMC0xMHMtNC40NzgtMTAtMTAtMTBoLTIzYy01LjUyMiwwLTEwLDQuNDc3LTEwLDEwUzY0LjQ3OSwzNjguODc2LDcwLjAwMSwzNjguODc2eiIvPg0KPHBhdGggZD0iTTkzLjAwMSwzODguODc2aC0yM2MtNS41MjIsMC0xMCw0LjQ3Ny0xMCwxMHM0LjQ3OCwxMCwxMCwxMGgyM2M1LjUyMiwwLDEwLTQuNDc3LDEwLTEwUzk4LjUyNCwzODguODc2LDkzLjAwMSwzODguODc2eiIvPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPC9zdmc+DQo=');
}
/* LOGOS */
.columbia{
    background-image: url('../img/LOGOS/2560px-Columbia_Sportswear_Co_logo.svg.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.american-eagle{
    background-image: url('../img/LOGOS/American-Eagle-LOGO.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.doto{
    background-image: url('../img/LOGOS/asset-brand-doto.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.claners{
    background-image: url('../img/LOGOS/CLANERS.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.cuidado-perro{
    background-image: url('../img/LOGOS/Cuidado-con-el-Perro-Vertical_Black.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.dp-street{
    background-image: url('../img/LOGOS/DPSTREET-LOGO.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.woolworth{
    background-image: url('../img/LOGOS/Hz-logotipo-DS-WW-V4.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.arome{
    background-image: url('../img/LOGOS/logo-arome.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.dportenis{
    background-image: url('../img/LOGOS/LOGO-DPORTENIS-MX.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.nike{
    background-image: url('../img/LOGOS/Logo-Nike-.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.puma{
    background-image: url('../img/LOGOS/logo-Puma.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.sephora{
    background-image: url('../img/LOGOS/Logo-Sephora.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.steve-madden{
    background-image: url('../img/LOGOS/logo-steve-madden.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.new-era{
    background-image: url('../img/LOGOS/NE_LOGO.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.panam{
    background-image: url('../img/LOGOS/New_logo_panam_OK.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.office-depot{
    background-image: url('../img/LOGOS/office-depot-seeklogo.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.steren{
    background-image: url('../img/LOGOS/steren-logo.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.superboletos{
    background-image: url('../img/LOGOS/Superboletos_LOGO_negro.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.taf{
    background-image: url('../img/LOGOS/TAF-LOGO-1200x1200-BCO.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.universo-fragancias{
    background-image: url('../img/LOGOS/uf_neg_recortado.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.vans{
    background-image: url('../img/LOGOS/Vans_OffTheWall_2016.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}
.waldos{
    background-image: url('../img/LOGOS/Waldos_logo.svg.png');
    background-size: 85%;
    background-color: #FFF;
    background-position: center;
    background-repeat: no-repeat;
}

.won, .init {
    z-index: 999;
    position: fixed;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
    border: 8px solid #333;
    border-radius: 7px;
}

.won {
    background-color: var(--green);
    top: 100%;
    width: 600px;
    height: 300px;
}

.init {
    /*background-color: var(--red);*/
    top: 30%;
    width: 600px;
    height: 300px;
}

.floating {
    position: relative;
    /*animation-name: floating;
    animation-iteration-count: infinite;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;*/
    cursor: pointer;
    text-decoration: underline;
    text-decoration-color: #333;
    margin-top: 30px;
}

.levelUp {
  animation: levelUp 2.5s ease-in-out;
  animation-delay: 2s;
}

.hidden {
  visibility: hidden;
}

@keyframes won {
    from {top: 100%; transform: rotate(180deg);}
    to   {top: 30%; transform: rotate(0deg);}    
}

@keyframes start {
    from   {top: 30%; transform: rotate(0deg);}    
    to {top: 100%; transform: rotate(180deg);}
}

@keyframes floating {
    0% {top: 0px; transform: rotate(0deg);}
    25% {top: 5px; transform: rotate(3deg);}
    50% {top: -5px; transform: rotate(-3deg);}
    100%   {top: 0px; transform: rotate(0deg);}  
}

@keyframes getIn {
    from {background-size: 0%;}
    to   {background-size: 70%;}
}

@keyframes getIn1 {
    from {background-size: 0%;}
    to   {background-size: 70%;}
}

@keyframes levelUp {
    0% {opacity: 0; visibility: visible;}
    50% {opacity: 1;}
    100%   {opacity: 0; visibility: hidden;}  
}

@media (max-width: 500px) {
    h1 {
        font-size: 37px;
    }
  
    /*.game {
        width: 330px;
        height: 396px;
    }*/

    /*.box {
        width: var(--dim);
        height: var(--dim);
        border: 2.1px solid #333;
    }*/

    .won, .init {
        width: 300px;
        height: 400px;
    }
  
    /*.init {
        top: 10%;
    }*/
}
@media (max-width: 480px) {
  .hide-480{
    display: none;
  }
  .show480{
    display: block;
  }
  section::before {
      height: 42px;
      content: "";
      display:block;
  }
  #home{
    height: auto;
  }
  #top-menu{
    width: 100% !important;
  }
  #top-menu li a{
    font-size: 12px;
    padding: .25rem!important;
  }
  #top-menu li a.btn{
    font-size: 12px;
    padding: .1rem .25rem !important;
  }
  #top-menu li a img{
    width: 75px;
  }
  #bg-destellos{
    padding-bottom: 0 !important;
  }
  .info{
    top: 50;
  }
  .home-title{
    line-height: 1.3;
  }
  .home-subtitle{
    top: -20px;
  }
  footer .text-end, footer .text-start{
    text-align: center !important;
  }
  footer li{
    text-align: center !important;
  }
  footer li a{
    padding: .35rem!important;
  }
  ::placeholder {
    color: #000;
    opacity: 1; /* Firefox */
    font-size: 12px;
    }
    #continue{
      height: 75vh !important;
    }
}