footer.background {
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
}
section {
    position: relative;
}
@media (max-width: 613px) {
    #footer {
        flex-direction: column !important;
    }
    section#koszonto {
        background: #05040c url(../images/desktop_hatter_800_1.jpg) top center no-repeat;
        background-size: 800px auto;
        padding-top: 210px;
    }
    section#a-jatek-elott {
        background: #000000 url(../images/desktop_hatter_800_2.jpg) top center repeat-y;
        background-size: auto 100%;
        padding-top: 80px;
    }
    section#a-jatek-celja-es-menete {
        background: #000000 url(../images/desktop_hatter_800_2.jpg) top center repeat-y;
        background-size: auto 100%;
    }
    section#a-jatek-tizparancsolata {
        overflow-x: hidden;
        height: 477px;
    }
    section#a-jatek-tizparancsolata img {
        width: 800px;
        height: 477px;
        position:absolute;
        margin-left: -400px;
        left:50%;
    }
    section#kod-bekuldese {
        background: #000000 url(../images/desktop_hatter_800_4.jpg) top center no-repeat;
        background-size: 800px auto;
    }
    footer {
        /*background: #000000 url(../images/desktop_hatter_800_4.jpg) top -910px center no-repeat;
        background-size: 800px auto;*/
        background-color: #000;
    }
    .container {
        width: 100%;
        min-width: 300px;
        max-width: 380px;
    }
    footer.background {
        width: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }
}
@media (min-width: 614px) {
    #footer {
        flex-direction: row !important;
    }
    section#koszonto {
        background: #05040c url(../images/desktop_hatter_900_1.jpg) top center no-repeat;
        background-size: 900px auto;
        padding-top: 320px;
    }
    section#a-jatek-elott {
        background: #000000 url(../images/desktop_hatter_900_2.jpg) top center repeat-y;
        background-size: 900px auto;
        padding-top: 80px;
    }
    section#a-jatek-celja-es-menete {
        background: #000000 url(../images/desktop_hatter_900_2.jpg) top center repeat-y;
        background-size: 900px auto;
    }
    section#a-jatek-tizparancsolata {
        overflow-x: hidden;
        height: 732px;
    }
    section#a-jatek-tizparancsolata img {
        width: 900px;
        height: 732px;
        position:absolute;
        margin-left: -450px;
        left:50%;
    }
    section#kod-bekuldese {
        background: #000000 url(../images/desktop_hatter_900_4.jpg) top center no-repeat;
        background-size: 900px auto;
    }
    footer {
        /*background: #000000 url(../images/desktop_hatter_900_4.jpg) top -910px center no-repeat;
        background-size: 900px auto;*/
        background-color: #000;
    }
    .container {
        max-width: 450px;
    }
    footer.background {
        width: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }
}
@media (min-width: 900px) {
    #footer {
        flex-direction: row !important;
    }
    section#koszonto {
        background: #05040c url(../images/desktop_hatter_1920_1.jpg) top center no-repeat;
        background-size: 1920px auto;
        padding-top: 540px;
    }
    section#a-jatek-elott {
        background: #000000 url(../images/desktop_hatter_1920_2.jpg) top center no-repeat;
        background-size: 1920px auto;
        padding-top: 80px;
    }
    section#a-jatek-celja-es-menete {
        background: #000000 url(../images/desktop_hatter_1920_2.jpg) top -620px center no-repeat;
        background-size: 1920px auto;
    }
    section#a-jatek-tizparancsolata {
        overflow-x: hidden;
        height: 1287px;
    }
    section#a-jatek-tizparancsolata img {
        width: 1920px;
        height: 1287px;
        position:absolute;
        margin-left: -960px;
        left:50%;
    }
    section#kod-bekuldese {
        background: #000000 url(../images/desktop_hatter_1920_4.jpg) top center no-repeat;
        background-size: 1920px auto;
    }
    footer {
        /*background: #000000 url(../images/desktop_hatter_1920_4.jpg) top -910px center no-repeat;
        background-size: 1920px auto;*/
        background-color: #000;
    }
    .container {
        max-width: 780px;
    }
    footer.background {
        width: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }
}
footer.background {
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
}
nav {
    height: 80px;
}
nav.bg-dark {
    background: transparent url(../images/menu_hatter.png) top left repeat-x !important;
}
nav.navbar {
    padding-top: 0;
    padding-bottom: 0;
}
.nav-link {
    color: #9c9c9c;
    font-family: 'HelveticaNeueLTPro-Cn';
    padding-right: 1rem;
    padding-left: 1rem;
}
.nav-link.active {
    color: #ffffff;
    text-decoration: underline;
    font-family: 'HelveticaNeueLTPro-HvCn';
}
.nav-link.active:hover {
    font-family: 'HelveticaNeueLTPro-HvCn';
}
.nav-link:hover {
    color: #ffffff;
    font-family: 'HelveticaNeueLTPro-Cn';
}
.offcanvas {
    background-color: #000000;
}
footer {
    width: 100%;
    padding-top: 10.9375vw;
    padding-bottom: 23.75vw;
}
.footerwrapper {
    width: 1170px;
    padding-top: 10.9375vw;
    padding-bottom: 13.75vw;
}
h1 {
    font-size: 34px;
    font-family: 'HelveticaNeueLTPro-BdCn';
}
h3 {
    font-size: 40px;
    font-family: 'HelveticaNeueLTPro-BdCn';
    text-transform: uppercase;
}
p {
    font-size: 21.4px;
    font-family: 'HelveticaNeueLTPro-Roman';
    text-align: justify;
}
.boldcn {
    font-family: 'HelveticaNeueLTPro-BdCn';
}
input {
    min-width: 45px;
    max-width: 75px;
    height: 115px;
    border-radius: 25px;
    font-size: 60px;
    text-align: center;
    font-family: 'HelveticaNeueLTPro-BdCn';
    box-shadow: 6px 0px 16px rgba(0,0,0,0.3) inset;
}
#kod1 {
    background-color: #f19aab;
}
#kod2 {
    background-color: #acf19a;
}
#kod3 {
    background-color: #9a9ef1;
}
#kod4 {
    background-color: #ebee97;
}
#kod5 {
    background-color: #e597ee;
}
#kod6 {
    background-color: #8feeff;
}
#nev {
    width: 100%;
    min-width: 300px;
    max-width: 465px;
    height: 55px;
    border-radius: 23px;
    background-color: #ffffff;
    font-size: 25px;
    text-align: left;
    font-family: 'HelveticaNeueLTPro-BdCn';
    padding: 0 20px;
}
.submitbutton {
    cursor: pointer;
    min-width: 286px;
    min-height: 253px;
    background: url(../images/bekuldom_gomb.png) center center;
    display: block;
    outline: none;
    border: none;
}
*:focus {
    outline: none;
}