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





/* xs */
@media (max-width: 575px) {
    html { font-size: 0.75rem; }
}

/* sm */
@media (min-width: 576px) and (max-width: 767px) {
    html { font-size: 0.75rem; }
}

/* md */
@media (min-width: 768px) and (max-width: 991px) {
    html { font-size: 0.75rem; }
}

/* lg */
@media (min-width: 992px) and (max-width: 1399px) {
    html { font-size: 0.875rem; }
}

/* xl */
@media (min-width: 1400px)  {
    html { font-size: 1rem; }
}




/* utility */
.img-fluid { max-width: 100%; height: auto; }

/* hlavni styly */

body { background-color: #070707; color: white; font-family: 'Alegreya Sans', sans-serif; margin: 0; font-size: 16px; overflow-x: hidden; }
body.ie { font-family: 'Open Sans', sans-serif;  }
body.noscroll { overflow: hidden; }

@media (max-width: 767px){
    p { font-size: 1.313rem !important; line-height: 1.875rem !important; }
}


@media (min-width: 1400px) {
    .container {
        max-width: 1400px;
    }
}

main { background-image: url('/images/cernycitron/pozadi.png'); background-size: cover; position: relative; display: block; }
/*main::after { content: ''; z-index: 0; position: absolute; top:0; left: 0; right: 0; bottom: 0; background-image: url('/images/cernycitron/pozadi/ilustrace-na-pozadi.png'); background-position: top center; background-repeat: no-repeat; }*/
.bg-wrapper { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url('/images/cernycitron/pozadi/ilustrace-na-pozadi.png'); background-position: top center; background-repeat: no-repeat; }


section { position: relative; z-index: 1; }

/* hlavička */
section.top { text-align: center; margin-bottom: 100px;  }
section.top .hlavicka { position: relative; }
section.top .hlavicka .brand { position: absolute; top: 2rem; left: 0; display: block; }

@media (min-width: 768px) and (max-width: 1400px){
    section.top .hlavicka .brand { width: 100px; height: auto; }
    section.top .hlavicka .slunce { max-width: 64%; }
}

@media (min-width: 576px) and (max-width: 767px){
    section.top { height: 250px; }
    section.top .hlavicka { text-align: right; }
    section.top .hlavicka .brand { display: block; width: 100px; height: auto; position: absolute; top:1rem; left: 0; }
    section.top .hlavicka .slunce.mobil { max-width: 40%; position: fixed; top:0; right: 0; }
}

@media (max-width: 575px){
    section.top { margin-bottom: 50px; }
    /*section.top .hlavicka .brand { display: block; width: 100px; height: auto; position: static; }*/
    section.top .hlavicka { text-align: right; }
    section.top .hlavicka .brand { display: block; width: 100px; height: auto; position: absolute; top:1rem; left: 0; }
    section.top .hlavicka .slunce.mobil { max-width: 60%; position: relative; right: -15px; }
}

/* produkt */
section.produkt { padding-bottom: 8.875rem; }
section.produkt h2 { font-family: Impacted; font-size: 3.875rem; font-weight: 400; line-height: 4.625rem; margin-bottom: 3.25rem; text-transform: uppercase; }
section.produkt p { font-size: 1.75rem; font-weight: 300; line-height: 2.125rem; margin-bottom: 3.625rem; color: #bbbbbb; max-width: 620px; }
section.produkt strong { color: #c5c4c4; }
section.produkt .kosik-cz-box { transform: translate3d(0,0,0); background-color: #050505; border-radius: 5px; border: 1px solid #cba020; padding: 1.5rem 2.2rem; display: flex; max-width: 620px; }
section.produkt .kosik-cz-box img { margin-right: 1.5625rem; }
section.produkt .kosik-cz-box p { color: #bababa; font-size: 1.375rem; font-weight: 300; line-height: 1.625rem; margin: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; }
section.produkt .kosik-cz-box a { color: #f8c125; text-decoration: underline; }
section.produkt .kosik-cz-box a:hover { color: #fff; }

section.produkt .kolaz { position: relative; }

section.produkt .plechovky                         { position: relative; /*left: 126px;*/ transform: scale(0.909286); transform-origin: top left;}
section.produkt .plechovky img.litovel-cc-nealko   { position: relative; z-index: 100; left: 142px; top: 20px; } /* relativni pozice, aby roztahl div */
section.produkt .plechovky img.litovel-cc          { position: absolute; left: 312px; z-index: 99; top: 47px; }

section.produkt .suroviny.vlevo                    { position: absolute; top: 278px; left: 0; width: 236px; height: 345px;}
section.produkt .suroviny.vlevo img.citron         { position: relative; z-index: 95; left: 41px; top: 143px; }
section.produkt .suroviny.vlevo img.chmel          { position: absolute; z-index: 96; left: 0;}

section.produkt .suroviny.vpravo                   { position: absolute; top: 126px; left: 459px; width: 214px; height: 351px; }
section.produkt .suroviny.vpravo img.citron        { position: absolute; z-index: 95;  }
section.produkt .suroviny.vpravo img.chmel         { position: relative; z-index: 95; left: 48px; top: 152px; }

@media (max-width: 575px){
    /*section.produkt .plechovky { position: absolute; left: 0; transform: scale(0.4); transform-origin: top left; }*/
    /*section.produkt .kolaz { display: none; }*/
    section.produkt .kosik-cz-box { flex-wrap: wrap; }
    section.produkt .kosik-cz-box img { margin: 0 0.5rem 0 auto; }
    section.produkt .kosik-cz-box p { /*flex: 0 0 100%;*/ }
    section.produkt .plechovky { transform: scale(0.35); }

}

@media (max-width: 767px) {
    section.produkt { padding-bottom: 2.875rem; }
    section.produkt .kosik-cz-box { padding: 0.75rem 1rem; }
    section.produkt .kosik-cz-box img { width: 42px; height: 42px; }
    section.produkt h2 { font-size: 1.75rem; line-height: 2.25rem; margin: 30px 0 20px 0; }
}

@media (max-width: 1200px){
    section.produkt { padding-bottom: 4.875rem; }
}


/* kdy červený citron */
section.kdy { padding-bottom: 10rem; }
section.kdy .kosik-cz-box { background-color: #050505; border-radius: 5px; border: 1px solid #cba020; padding: 2rem 2.75rem; display: flex; max-width: 47.5rem; margin: 9.5rem auto /*7.5rem auto*/; }
section.kdy .kosik-cz-box img { margin: 0 3.1875rem 0 0; }
section.kdy .kosik-cz-box p { color: #bababa; margin: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; font-size: 1.5rem; font-weight: 300; line-height: 2rem; align-self: center; max-width: 500px; }
section.kdy .kosik-cz-box a { color: #f8c125; text-decoration: underline; }
section.kdy .kosik-cz-box a:hover { color: #fff; }

section.kdy .kdyz { text-align: center; font-family: Impacted; text-transform: uppercase; font-size: 1.75rem; font-weight: 400; }
section.kdy .img-box { height: 237px; margin-bottom: 2.25rem; display: flex; }
section.kdy img { align-self: center; margin: 0 auto; }


@media(max-width: 1200px){
    section.kdy .kosik-cz-box { margin: 7.5rem auto; }
}

@media(max-width: 767px){
    section.kdy .img-box { height: auto; margin-bottom: 0.5rem; }
    section.kdy img { margin-bottom: 1rem; width: 250px; max-width: 100%; height: auto; }
    section.kdy .kdyz .title{ margin-bottom: 5rem; }
    section.kdy .kosik-cz-box { margin: 0 auto 3.75rem 0; flex-wrap: wrap; padding: 0.75rem 1rem; }
    section.kdy .kosik-cz-box img { width: 42px; height: 42px; margin: 0 0.5rem 0 auto; align-self: normal; }
}

@media(max-width: 575px){
    section.kdy { padding-bottom: 4rem; }
    /*
    section.kdy .kosik-cz-box { flex-wrap: wrap; }
    section.kdy .kosik-cz-box img { margin: 0 auto 1rem auto; }
    section.kdy .kosik-cz-box p { flex: 0 0 100%; }
    */
}



/* panel s obrázky nad sekcí soutěž */

.soutez-top { height: 130px; background-image: url('/images/cernycitron/soutez/soutez-pozadi-orez.png'); background-repeat: repeat-x; background-position: center; top: 5px; z-index: 10; }

/* soutěž */
section.soutez { z-index: 10; background-color: #fbc320; padding-bottom: 5.5rem; background-image: url('/images/cernycitron/soutez/stin.png'); background-repeat: no-repeat; background-position: bottom center; position: relative; }
section.soutez h2 { font-family: Impacted; color: #ffffff; font-size: 3.375rem; line-height: 3.75rem; text-transform: uppercase; margin-bottom: 5.5rem; position: relative; font-weight: 400; }
/*section.soutez h2::after { position: absolute; content: url('/images/cernycitron/soutez/linka.png'); width: 325px; height: 13px; bottom: -2.75rem; left: 0; }*/
section.soutez .nadpis-obal { position: relative; }
section.soutez .linka { position: absolute; bottom: -2rem; transform: translate3d(0, 100%, 0); }
section.soutez h2 span.black { color: #111111; font-size: 4.375rem; line-height: 4.875rem; }
section.soutez p { color: #9d5708; font-size: 1.625rem; font-weight: 300; line-height: 2rem; margin: 0 0 2.25rem 0; max-width: 670px; }
section.soutez .obal { position: relative; }
section.soutez img.lednice { position: absolute; right: 70px; top: -101px; }
/*section.soutez .soutezni-tlacitko { display: block; width: 231px; height: 106px; background-image: url('/images/cernycitron/soutez/tlacitko.png'); background-size: cover; text-transform: uppercase; color: #fff; font-size: 1.5625rem; line-height: 1.7875rem; font-family: Impacted; padding: 1.25rem 2.5625rem 2rem 2.75rem; text-decoration: none; }
section.soutez .soutezni-tlacitko span.padding { padding-left: 24px; }*/
/*section.soutez .soutezni-tlacitko { display: block; width: 212px; height: auto; transform: translate3d(0,0,0); }*/

section.soutez svg { cursor: pointer; }
section.soutez svg #bg { transition: 0.3s; }
section.soutez svg:hover #bg { fill: #2b3c89; }

@media (min-width: 768px) and (max-width: 990px){
    section.soutez img.lednice { width: 220px; height: auto; position: absolute; right: 5%; top: -101px; }
}

@media(max-width: 767px){
    section.soutez { background-size: cover; }
    section.soutez img.lednice { position: absolute; width: 150px; height: auto; right: 0; top: 20%; opacity: 0.2 !important; z-index: 0; }
    section.soutez h2 { font-size: 1.75rem; line-height: 1.75rem; margin: 1.875rem 0 2rem 0; }
    section.soutez h2 span.black { font-size: 2.27rem; }
    section.soutez .linka { bottom: 0; }
    section.soutez .soutezni-tlacitko svg { width: 150px; }
}

.ilustrace img { position: absolute; z-index: 0; }
.ilustrace img.citron.vlevo{ top: calc(100% - 155px); left: 0; }
.ilustrace img.citron.vpravo{ top: calc(100% - 115px); left: 70%;}
.ilustrace img.chmel{ top: calc(100% - 183px); left: 42%;}

@media(max-width: 768px){

    .ilustrace img.citron.vlevo{ top: calc(100% - 120px); left: 0; width: 120px; height: auto; }
    .ilustrace img.citron.vpravo{ top: calc(100% - 95px); left: 69%; width: 120px; height: auto; }
    .ilustrace img.chmel{ top: calc(100% - 144px); left: 40%; width: 120px; height: auto; }
}


footer { position: relative; background-color: #070707; }
footer .stamp { position: relative; top: -3rem; display: inline-block; left: 50%; margin-left: -48px; z-index: 11; }
footer .content { background-color: #070707; }
footer .content .contact { text-align: center; }
footer .content .contact a { text-decoration: none; }
footer .content .contact .box { display: inline-block; background-color: #070707; border: 2px solid #fbc320; padding: 0.75rem 1.5rem; color: white; font-weight: 900; line-height: 1.5rem; text-transform: uppercase; font-family: 'Source Sans Pro'; margin: 0 0.5rem 0.5rem 0.5rem; }
footer .content .contact .box:hover { background-color: #2b3c89; }
footer .content .contact .box img { vertical-align: baseline; margin-right: 0.5rem; }
footer .content .contact .box strong { color: #fbc320; }
footer .links ul { margin: 3rem 0 2rem 0; padding: 0; list-style: none; }
footer .links ul li { font-family: 'Source Sans Pro'; font-size: 0.813rem; font-weight: 900; line-height: 1.25rem; text-transform: uppercase; margin: 0.5rem 0; color: #999999; }
footer .links ul li a { color: #999999; font-weight: 700; text-decoration: none; }
footer .links ul li a:hover { color: #fff; text-decoration: underline; }

footer .copyright { text-align: center; color: #777777; font-size: /*0.813rem*/ 1rem; line-height: 1.5rem; padding: 1rem 0 3rem 0; }
footer .copyright a { color: #777777; text-decoration: none; }
footer .copyright a:hover { color: #fff; text-decoration: underline; }

@media (max-width: 767px) {
    /*footer .content .contact a:first-of-type { margin-top: 3rem; }*/
    footer .content .contact a { margin-top: 1rem; display: block;}
    footer .content .contact a .box { padding: 0.5rem; min-width: 180px; }
    footer .content .links ul { text-align: center; }
    footer .content .contact a .box .phone-text { display: block; }
    footer .links ul { margin: 1.5rem 0 1rem 0; }
    footer .links ul li { font-size: 1.313rem; line-height: 1.875rem; }
}

/* vekova brana */

.age-gate-overlay { position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; background-color: rgba(0,0,0,0.9); z-index: 999; }
/*
#age-gate { padding: 5rem 11.5rem 3rem 4.5rem; text-align: right; overflow: visible; display: inline-block; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 575px; max-width: 90%; z-index: 1000 }

@media (min-width: 769px) and (max-width: 991px){
    #age-gate { text-align: center; padding: 0 1rem 1rem 1rem; min-height: 200px; }
    #age-gate-beer { display: none; }
    #age-gate h2 {  margin: 2rem 0; }

}

@media (max-width: 768px) {
    #age-gate{ text-align: center;  padding: 3rem 1rem 1rem 1rem; }
    #age-gate-beer { display: none; }
    #age-gate h2 {  margin: 2rem 0; }
}
*/
#age-gate { font-family: Impacted; color: #111111; border-radius: 0.25rem; background-size: cover; background-color: #fbc320; /*padding: 5rem 11.5rem 3rem 1rem;*/ text-align: right; overflow: visible; display: inline-block; position: relative; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); width: 575px; max-width: 90%; }
#age-gate .top { position: absolute; z-index: 1; transform: translate3d(0, -3.25rem, 0); width: 100%; left: 0; height: 66px; background-image: url('/images/cernycitron/soutez/soutez-pozadi-orez.png'); background-repeat: repeat-x; background-position: -729px bottom; }

#age-gate .ilustrace { position: relative; z-index:0; }
#age-gate .ilustrace img { position: absolute; z-index: 0; transform: scale(0.6) translate3d(0,0,0); }
#age-gate .ilustrace img.citron.vlevo{ top: -8rem; left: 0; }
#age-gate .ilustrace img.chmel{ top: -9rem; left: 12%;}

#age-gate .wrapper { padding: 1rem 9.5rem 2rem 1rem; text-align: center; position: relative; z-index: 2; background-color: #fbc320; background-size: cover; background-image: url('/images/cernycitron/soutez/stin.png'); background-repeat: no-repeat; background-position: top center;  }
#age-gate .wrapper h2 { text-transform: uppercase; color: #111111;;  font-family: 'Impacted', serif;  font-size: 2rem;  font-weight: 400;  line-height: 3rem; margin: 0; }
#age-gate .wrapper .buttons { display: inline-block; font-size: 3.5rem; }
#age-gate .wrapper .btn { text-transform: uppercase; font-size: 3.5rem; font-family: Impacted; color: #111111; background: transparent; line-height: 1.42857; cursor: pointer; margin-bottom: 0.5rem; padding: 0; text-transform: uppercase; border-radius: 0; font-weight: 400; border: none; letter-spacing: normal; -webkit-transition: 0.3s; transition: 0.3s; outline: none; }
#age-gate .wrapper .btn.btn-yes:hover { color: #2b3c89; }
#age-gate .wrapper .separator { margin: 0 1rem; }

#age-gate .wrapper .btn.btn-no:hover { color: #d30a11; }
#age-gate .wrapper .buttons .btn.btn-no { text-align: right; }
#age-gate .wrapper .buttons .btn.btn-no:target, :focus, :active, :focus:active { text-decoration: none; outline: none; border: none; }

#age-gate .wrapper .sorry p { text-align: center; color: black; min-height: 100px; margin: 0; font-size: 0.813rem; line-height: 1.125rem; text-transform: uppercase; padding-top: 2rem; }

#age-gate img.produkt { position: absolute; z-index: 2; top: -40%; right: -41px; max-height: 19rem; width: auto; transform: translate3D(0,0,0); }

@media (min-width: 768px) and (max-width: 990px){
    #age-gate { text-align: center;  }
    #age-gate .wrapper { padding: 0 5rem 2rem 1rem; width: 500px; }
    #age-gate img.produkt { max-height: 19rem; top: -50%; }
}

@media (max-width: 767px) {
    #age-gate { text-align: center; }
    #age-gate .wrapper { padding: 3rem 1rem 1rem 1rem; min-height: 200px;  }
    #age-gate img.produkt { display:none; }
    #age-gate h2 {  margin: 2rem 0; }
}

/* cookies lišta */

#cookies-information {
    padding: 10px 0;
    font-family: Times,'Times New Roman','Liberation Serif',serif;
    font-size: 15px;
    border-top: 1px solid #dbdbdb;
}

.cc-btn.cc-dismiss { font-family: 'Source Sans Pro'; border: 1px solid #bb9f4c !important; padding: 5px 20px; margin-right: 30px; margin-top: 1px; cursor: pointer; border-radius: 3px; font-weight: bold; text-transform: uppercase; }
.cc-banner { font-family: Times,'Times New Roman','Liberation Serif',serif; font-size: 15px; border-top: 1px solid #dbdbdb; }
.cc-link { color: #bb9f4c !important; }