/* OBECNE STYLY */

body, html {
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
}

* { margin: 0; padding: 0; outline: none;}

BODY, DIV, TABLE, CAPTION,ADRESS, IMG {
  border: 0;
  font-family: Arial;
  margin: 0;
  padding: 0;
}

body {
    background-color: white;
    height: 100%;
    /*background: transparent url('../img/background.jpg') top center no-repeat;*/
    background-attachment: scroll;
    background-size: auto;
    background-attachment: fixed;
    background-size: cover;
}

div.hidden_link{display: none;}

.grecaptcha-badge{z-index: 99;}

.marker-position{margin-left: 30px;}

@media only screen and ( max-width: 500px ){
    .grecaptcha-badge{display: none;}
}

h1, h2, h3, h4, h5, p, ul, ol, b, a, li, td, th, strong, span, div, input, select, textarea{font-family: 'Didact Gothic', sans-serif;}

h1{text-align: center;color:#505050;font-size: 35px;font-weight: 200;margin-bottom: 10px;}
h1.zbozi{font-family: 'Kalam', cursive;font-size: 60px;font-weight: 300;}
h2{color:#505050;font-size: 30px;font-weight: 200;margin-bottom: 10px;}
h3{color:#505050;font-size: 25px;font-weight: 200;margin-bottom: 10px;}
h4{color:#505050;font-size: 20px;font-weight: 200;margin-bottom: 10px;}
h5{color:#505050;font-size: 18px;font-weight: 200;margin-bottom: 10px;}

@media only screen and ( max-width: 500px ){
    h1{font-size: 30px;}
    h2{font-size: 25px;}
    h3{font-size: 20px;}
}

a{color: #66cc33;text-decoration: none;}
a:hover{text-decoration: underline;}

form{text-align: left;}

ul, ol {
        line-height: 100%;
}

.toLeft {
  float: left;
}

.toRight {
  float: right;
}

.hidden {
    display: none!important;
}

.toCenter{display: block;text-align: center;margin: 0 auto;}
.halfwidth{width: 50%;}
.right{text-align: right;}
.cleaner{display: block;height: 0;clear: both;overflow: hidden;content: ' ';font-size: 0;}
.fb-like{top:-5px;}
.seznam{width: 100%; font-size: 12px; text-align: left;}
.seznam th{padding: 5px;font-size: 15px;}
.seznam td{padding: 5px;font-size: 15px;}
.seznam input.save{display: inline-block;vertical-align: top;cursor: pointer;background: transparent url('../img/save.png') no-repeat; width:20px!important;height:20px; border: none;border-radius: 0;padding: 0;}

.image img{max-width: 100%;height: auto;}
.image_resized{max-width: 100%;height: auto;}
.image-style-align-left{float: left;margin-right: 20px;}
.image-style-align-right{float: right;margin-left: 20px;}
.image-style-align-center{display: inline-block;text-align: center;margin: 0 auto;}
.image-style-block-align-left{display: block;text-align: left;}
.image-style-block-align-right{display: block;text-align: right;}
.image-style-block-align-center{display: block;text-align: center;margin: 0 auto;}

@media only screen and ( max-width: 800px ){
    .image-style-align-left{float: none;margin-right: 0px;}
    .image-style-align-right{float: none;margin-left: 0px;}
}

.msgOK{position: relative;z-index: 99;background-color: #438bc5;  font-weight: 900; font-size: 15px; color: white; text-align: center; padding: 10px;}
.msgError{position: relative;z-index: 99;background-color: #E21A1A;  font-weight: 900; font-size: 15px; color: white; text-align: center; padding: 10px;}

/* LAYOUT */
#panelMiddle{min-height: 100%;position: relative;overflow: hidden;max-width: 1920px;margin: 0 auto;z-index: 94;}
.panelMiddleIn{max-width:1200px; padding: 0px 10px; margin:0 auto; }
#panelStred{padding: 0 0 0 0;}
#panelTop{position: relative;width: 100%;z-index: 99;background-color:rgba(255, 255, 255, 0.9);box-shadow: 0 5px 10px 0 rgba(50, 50, 50, 0.08);transition: all 0.5s;}

.fixed{top:0;}

.visible{position: fixed!important;top:0px!important;}
.invisible{position: fixed!important;top:-125px!important;}

#panelMenu{text-align: center;}
#panelSlider{position: relative;}
#panelContent{padding:50px 0;}
#panelSocial{text-align: left;}
#panelBottom{width: 100%;/*background-color: #1f5956;*/background-color: white;box-shadow: 5px 0 10px 0 rgba(50, 50, 50, 0.08);box-shadow: 2px 2px 10px 0 rgba(50, 50, 50, 0.3);}

#panelFooter{width:100%;/*background-color: #17413f;*/background-color: #f2f4f5;}

#panelKontakt{position: relative;padding: 5px;overflow: hidden;z-index: 98;background-color: #f0faeb;border-left: 2px solid white;border-right: 2px solid white;border-bottom: 2px solid white;}

#google_translate_element{float: right;}

.goog-te-gadget{font-size: 0!important;}
.goog-te-gadget span a{display: none!important;}
.goog-te-combo{padding: 5px;max-width: 140px;margin: 0!important;border: 1px solid black;background: white url('../img/google_icon.png') center left no-repeat;padding-left: 25px;}

#goog-gt-tt
{
    display:none!important;
}

#editace{max-width: 600px;margin: 0 auto;}

#sprava{width: 100%;text-align: right;}
#sprava a{font-size: 15px;padding: 5px;}

.ck.ck-list {
  max-height: 300px;
  overflow-y: scroll!important;
}

.ck-editor__editable .ck-list-bogus-paragraph {
  display: inline-block!important;
}

#kraje{text-align: center;}
#kraje a{display: inline-block;padding: 0 10px;}
#kraje a.mark{color: #f07c31;}

.terminy{display: inline-block;}
.terminy p{float: left;color: #505050;margin:0 10px;padding: 2px 0;}

.terminy .switch {
    float: right;
    font-size: 100%;
    height: 1.6em;
    position: relative;
}

.terminy .switch > input[type="checkbox"] {
    display: none;
}

.terminy .switch .switch-style {
    height: 1.6em;
    left: 0;
    background: #C0CCDA;
    -webkit-border-radius: 0.8em;
    border-radius: 0.8em;
    display: inline-block;
    position: relative;
    top: 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    width: 3em;
    cursor: pointer;
}

.terminy .switch > input[type="checkbox"]:checked + .switch-style {
    background-color: #ff0000;
}

.terminy .switch .switch-style:before {
    display: block;
    content: '';
    height: 1.4em;
    position: absolute;
    width: 1.4em;
    background-color: #fff;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    left: 0.1em;
    top: 0.1em;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.terminy .switch > input[type="checkbox"]:checked + .switch-style:before {
    left: 50%;
}

#data_table input{border: none;color: #505050;font-size: 15px;width: 100%;}

#kontakt{width: auto;text-align: center;box-sizing: border-box;}
#kontakt p{font-size: 15px;color: #505050;padding: 5px;}

#bottom{position: relative; padding: 20px;}
#bottom div{text-align: left;vertical-align: top;padding: 10px;box-sizing: border-box;}
#bottom p{color:#505050;font-size: 17px;font-weight: 400;margin-bottom: 5px;}
#bottom strong{;font-size: 17px;font-weight: 600;}
#bottom a{color:#66cc33;font-size: 17px;font-weight: 400;}
#bottom a:hover{text-decoration: underline;}

#footer{padding: 10px;}
#footer p{text-align: right;font-size: 14px;color: #505050;margin-bottom: 0;}
#footer a{color:#66cc33;font-size: 14px;font-weight: 400;}
#footer img{max-width: 100%;}

#footer a.facebook img{width: 20px;height: 20px;margin-right: 5px;}
#footer a.instagram img{width: 20px;height: 20px;margin-right: 5px;}

@media only screen and ( max-width: 1200px ){
    #panelBottom{position: relative;bottom: 0px;}
    #panelFooter{position: relative;}
    #panelStred{padding-bottom: 0px;}
    #bottom{text-align: center;padding: 20px 0;}
    #bottom div{float: none!important;padding: 0; margin: 10px 0!important;width: 100%!important;text-align: center!important;}
    #bottom div img{float: none!important;}
    #bottom div p{text-align: center!important;}
    #footer p{text-align: center;float: none; margin-bottom: 5px;}
}

#edit{float: right; margin: 5px; width: 130px;}

#upload label{float: left; padding-top: 4px; font-size: 13px; color: white; margin-left: 10px;}
#upload b{cursor: pointer; float: left;}
#upload input{float: left; margin-left: 10px;}
#upload select{float: left;margin-left: 10px;height: 21px;}
#upload .popis{height: 21px;}
#upload div.img{display: none; float: left; padding: 5px; background-color: #546a76;color: white;}
#upload div.file{display: none; float: left; padding: 5px; background-color: #546a76;color: white;}

#jazyky{float: right;text-align: center; font-size: 0;margin: 15px 10px 0px 10px;}
#jazyky a{font-size: 0;padding:0 4px;}
#jazyky a img{width:30px;height: 20px;transition: all 0.5s;box-shadow: 2px 2px 5px 0px rgba(0,0,0,0.2);}
#jazyky a:hover img{transform: scale(1.3);}

@media only screen and ( max-width: 1000px ){
    #jazyky{float: none;}
}

#logo{padding:20px 0 11px 0;float: left;text-align: center;}
#logo a{text-decoration: none;width: 100%;}
#logo a img{max-width:100% !important;height:auto !important;}

@keyframes jackInTheBox {
  40% {
    transform: rotate(0deg);
  }
  41% {
    transform: rotate(3deg);
  }
  42% {
    transform: rotate(-3deg);
  }
  43% {
    transform: rotate(3deg);
  }
  44% {
    transform: rotate(0deg);
  }
}

.jackInTheBox {
    animation: bounce 30000ms infinite ease-in-out;
  -webkit-animation-name: jackInTheBox;
  animation-name: jackInTheBox;
}

#panelTop a.direct_kytice{float: left;margin-top: 15px;margin-left: 30px;position: relative;padding: 15px;border-radius: 100px;color: #ffffff;background-color: #71b73b;font-size: 16px;font-weight: normal;text-align: center;box-sizing: border-box;z-index: 20;cursor: pointer;transition: all 0.5s;}
#panelTop a.direct_kytice:hover{text-decoration: none;}

@media only screen and ( max-width: 500px ){
    #panelTop a.direct_kytice{display: none;}
}

.shake {
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    animation-name: shakeMe;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@keyframes shakeMe {
    2%, 18% {
        transform: translate3d(-5px, 0, 0);
    }

    4%, 16% {
        transform: translate3d(5px, 0, 0);
    }

    6%, 10%, 14% {
        transform: translate3d(-5px, 0, 0);
    }

    8%, 12% {
        transform: translate3d(5px, 0, 0);
    }

    18.1% {
        transform: translate3d(0px, 0, 0);
    }
}

#panelLeft{float: left;width: 350px;margin-right: 50px;}
#panelLeft img{max-width: 100%!important; height: auto!important;}

#panelMain2{width: auto;text-align: center;box-sizing: border-box;}
#panelMain{width: auto;box-sizing: border-box;}
#panelMain img{max-width: 100%!important; height: auto!important;margin: 5px;}
#panelMain div.popis{text-align: left;}
#panelMain h1{text-align: left;}
#panelMain p{color:#505050;font-size: 17px;margin-bottom: 20px;}
#panelMain b{color:#505050;font-size: 17px;margin-bottom: 20px;font-weight: 600;}
#panelMain strong{font-weight: 600;}
#panelMain a{text-decoration: none;}
#panelMain a:hover{text-decoration: underline;}
#panelMain a.vice{display: inline-block;text-align: center; text-decoration: none;color: #66cc33;font-size: 16px;font-weight: 400;padding: 0 10px 10px 10px;border-bottom: 2px solid #f07c31;}
#panelMain ul{margin-bottom: 20px;margin-left: 30px;overflow:visible;line-height: 150%;list-style: inside;}
#panelMain li{color:#505050;font-size: 17px;list-style-image: url("../img/arrow_right.png");}
#panelMain div.ramecek li{font-size: 12px;}
#panelMain ol{margin-left: 20px; margin-bottom: 20px; line-height: 200%;}
#panelMain hr{border: 0;height: 1px;background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)); margin-bottom: 50px;margin-top: 50px;}

#panelMain a.button{color: white;text-decoration: none;font-size: 12px;font-weight: 600;border: 1px solid #66cc33;background-color: #66cc33;padding: 10px;transition: all 0.9s;text-transform: uppercase;}
#panelMain a.button:hover{color: #505050;border: 1px solid #66cc33;background-color: white;text-decoration: none;}

@media only screen and ( max-width: 900px ){
    #panelMain img{float:none!important;margin: 0!important;max-width: 100%!important;}
    #panelMain div{width: 100%!important;float: none!important; margin: 10px 0!important;box-sizing: border-box;}
    #panelMain h1{text-align: center;}
    #panelMain div.popis{text-align: center;}
}

table{width: 100%;border-collapse: collapse;border: 1px solid #c3c3c3;}
table p{margin: 0!important;}
th{border: 1px solid #c3c3c3;color:#505050;font-size: 17px;text-align: left;padding: 10px;}
td{border: 1px solid #c3c3c3;color:#505050;font-size: 17px;text-align: left;padding: 5px;}
tr{}

#mapa{width: 100%;height: 500px;}

#dokumenty{text-align: center;margin: 20px 0;}
#dokumenty p{margin-bottom: 5px;}

#fotky{text-align: center;margin-bottom: 20px;}
#fotky div.fotky{position: relative;width: 500px;height: 500px;display: inline-block;margin: 8px;}
#fotky .fotky a{display: block;position: relative;width: 500px;height: 500px;font-size: 0;text-align: center;overflow: hidden;}
#fotky div.fotky2{position: relative;width: 250px;height: 250px;display: inline-block;margin: 8px;}
#fotky .fotky2 a{display: inline-block;position: relative;width: 250px;height: 250px;font-size: 0;text-align: center;overflow: hidden;}

@media only screen and ( max-width: 500px ){
    #fotky div.fotky{position: relative;width: 250px;height: 250px;display: inline-block;margin: 8px;}
    #fotky .fotky a{display: block;position: relative;width: 250px;height: 250px;font-size: 0;text-align: center;overflow: hidden;}
}

#fotky a img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) scale(1);transition: all 0.5s;}
#fotky a:hover img{transform: translate(-50%, -50%) scale(1.1);}
#fotky a span{position: absolute;opacity: 0;left: 50%;top: 50%;transform: translate(-50%, -50%);text-align: center;color:white;font-size: 25px;font-weight: 400;text-shadow: 0px 0px 10px #000000;transition: opacity 1s;}
#fotky a:hover span{opacity: 1;}
#fotky a.del{position:absolute;top: 3px; left:21px;background: transparent url('../img/kos_foto.png') no-repeat; width:15px; height:15px; border: none;}
#fotky div.edit{cursor: pointer; z-index: 90;position:absolute; top: 3px; left:3px;background: transparent url('../img/pencil_foto.png') no-repeat; width:15px; height:15px; border: none;}
#fotky form{display: none; width:180px; float: left; position: relative; top:15px; padding: 5px; background-color: #546a76;color: white;}
#fotky form label{float: left; margin-right: 5px;font-size: 12px; color: white;}
#fotky input{padding: 2px; margin-bottom: 5px;}
#fotky form input.button{text-align: center; color: black; background-color: white; border: none;}

#galerie{text-align: center;}
#galerie a{position: relative;width: 250px;height: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;overflow: hidden;margin: 8px;}
#galerie a img{max-height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) scale(1);transition: all 0.5s;opacity: 0.8;}
#galerie a:hover img{transform: translate(-50%, -50%) scale(1.1);opacity: 1;}
#galerie a span{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);text-align: center;color:white;font-size: 30px;font-weight: 400;text-shadow: 0px 0px 10px #000000;}
#galerie p{position: relative;width: 250px;height: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;overflow: hidden;margin: 8px;}
#galerie p img{max-height: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%) scale(1);transition: all 0.5s;opacity: 0.8;}
#galerie p:hover img{transform: translate(-50%, -50%) scale(1.1);opacity: 1;}
#galerie p span{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);text-align: center;color:white;font-size: 30px;font-weight: 400;text-shadow: 0px 0px 10px #000000;}

#znacky{text-align: center;}
#znacky a{position: relative;width: 250px;height: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;overflow: hidden;margin: 8px;}
#znacky a img{max-width: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);filter: grayscale(100%); opacity: 0.5;transition: all 0.5s;opacity: 0.8;}
#znacky a:hover img{filter: grayscale(0%); opacity: 1;}
#znacky p{position: relative;width: 250px;height: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;overflow: hidden;margin: 8px;}
#znacky p img{max-width: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);filter: grayscale(100%); opacity: 0.5;transition: all 0.5s;opacity: 0.8;}
#znacky p:hover img{filter: grayscale(0%); opacity: 1;}

#kontakty{text-align: center;display: flex;flex-flow: row wrap;justify-content: center;}
#kontakty div.kontakty{width: 300px;padding: 20px;margin: 8px;box-shadow: 1px 1px 10px 0 rgba(50, 50, 50, 0.08);}
#kontakty img{max-width: 100%;margin: 5px;}
#kontakty p{color: #505050;font-size: 17px;margin-bottom: 20px;}
#kontakty a.button{color: white;text-decoration: none;font-size: 12px;font-weight: 600;border: 1px solid #66cc33;background-color: #66cc33;padding: 10px;transition: all 0.9s;text-transform: uppercase;}
#kontakty a.button:hover{color: #505050;border: 1px solid #66cc33;background-color: white;text-decoration: none;}

#kariera{text-align: left;display: flex;flex-flow: row wrap;justify-content: center;}
#kariera div.kariera{width: 50%;padding: 20px;box-sizing: border-box;box-shadow: 1px 1px 10px 0 rgba(50, 50, 50, 0.08);}
#kariera img{max-width: 100%;margin: 5px;}
#kariera h3{text-align: center;}
#kariera p{color: #505050;font-size: 17px;margin-bottom: 20px;}
#kariera ul{margin-bottom: 20px;margin-left: 30px;overflow:visible;line-height: 150%;list-style: inside;}
#kariera li{color:#505050;font-size: 17px;list-style-image: url("../img/arrow_right.png");}
#kariera a.button{color: white;text-decoration: none;font-size: 12px;font-weight: 600;border: 1px solid #66cc33;background-color: #66cc33;padding: 10px;transition: all 0.9s;text-transform: uppercase;}
#kariera a.button:hover{color: #505050;border: 1px solid #66cc33;background-color: white;text-decoration: none;}

@media only screen and ( max-width: 800px ){
    #kariera div.kariera{width: 100%;}
}

#zbozi{position: relative;margin: 20px 0;text-align: center;/*overflow: hidden;*/}
#zbozi a.zbozi{position: relative;vertical-align: top;width: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;padding: 20px;margin: 8px;box-shadow: 1px 1px 10px 0 rgba(50, 50, 50, 0.08);}
#zbozi span.zbozi{position: relative;vertical-align: top;width: 250px;box-sizing: border-box;display: inline-block;font-size: 0;text-align: center;padding: 20px;margin: 8px;box-shadow: 1px 1px 10px 0 rgba(50, 50, 50, 0.08);/*-webkit-filter: grayscale(100%);filter: grayscale(100%);*/opacity: 0.7;}
#zbozi a:hover{text-decoration: none;}
#zbozi button{cursor: pointer;margin-top: 20px;color: white;text-decoration: none;font-size: 12px;font-weight: 600;border: 1px solid #71b73b;background-color: #71b73b;padding: 10px;transition: all 0.9s;text-transform: uppercase;}
#zbozi a:hover button{color: #505050;border: 1px solid #66cc33;background-color: white;text-decoration: none;}
#zbozi img{max-width:100%;transition: all 0.5s;}
#zbozi a:hover img{transform: scale(1.1);}
#zbozi p{display: block;font-size: 17px;color: #505050;margin-bottom: 10px;}
#zbozi p.nadpis{text-decoration: none;color: #505050; font-size: 24px;letter-spacing: -0.5px;font-weight: 400;text-decoration: none;}
#zbozi span.popis{display: block;height:90px;}
#zbozi p.cena{text-decoration: none;color: #505050; font-size: 20px; font-weight: 400;text-decoration: none;margin-bottom: 0;}
#zbozi strong{font-weight: 600;}
#zbozi span.sipka{position: absolute;top: 150px; left: -50px;z-index: 90;}
#zbozi h3{font-family: 'Kalam', cursive;text-align: left;font-size: 45px;line-height: 45px;letter-spacing: -2px;font-weight: 300;padding: 35px 0 0px 0px;margin-left: 10px;}

/*#zbozi span.nedostupne img{-webkit-filter: grayscale(100%);filter: grayscale(100%);}*/

#zbozi div.bullet{float: right;}
#zbozi span.green{float: left;background: #71b73b;border-radius: 50%;-moz-border-radius: 50%;-webkit-border-radius: 50%;color: #ffffff;display: inline-block;font-size: 100px;font-weight: bold;line-height: 150px;margin-right: 15px;text-align: center;width: 150px;margin-bottom: 20px;}
#zbozi span.pink{position: relative;border-radius: 50%;-moz-border-radius: 50%;-webkit-border-radius: 50%;color: #ffffff!important;display: table-cell;vertical-align: middle;font-size: 16px!important;font-weight: normal;text-align: center;box-sizing: border-box;width: 100px;height: 100px;z-index: 20;cursor: pointer;}
#zbozi span.pink p{color: #ffffff;font-size: 16px;font-weight: normal;line-height: 16px;margin-bottom: 0;}

.pink1{left:0px;background-color: #f14399;}
.pink2{left:-5px;background-color: #f151a0;}
.pink3{left:-10px;background-color: #f77fba;}
.pink4{left:-15px;background-color: #ff99cc;}

.red1{left:0px;background-color: #ff0f14;}
.red2{left:-5px;background-color: #ea0005;}
.red3{left:-10px;background-color: #cc0001;}

#triangle-topright{
    display: table;
    position: absolute;
    top: -10px;
    right: -10px;
  background: #ff99cc;
   border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  text-align: center;
  box-sizing: border-box;
  z-index: 50;
}

#triangle-topright.green{background: #71b73b!important;}
#triangle-topright.gray{background: #909090!important;}

#premium{
    position: absolute;
    top: -10px;
    right: -10px;
    background: transparent url('../img/premium.png') no-repeat;
    box-sizing: border-box;
    width: 80px;
    height: 100px;
    z-index: 50;
}

#santa{
    position: absolute;
    top: -18px;
    left: 0px;
    background: transparent url('../img/santa.png') no-repeat;
    box-sizing: border-box;
    width: 60px;
    height: 57px;
    z-index: 50;
}

#triangle-topright span{display: table-cell;vertical-align: middle;animation: rotate2 5s infinite ease-in-out;width: 70px;height: 70px;color: white;font-size: 14px;font-weight: bold;box-sizing: border-box;overflow-wrap: break-word;}

@media only screen and ( max-width: 800px ){
    #zbozi h3{font-size: 40px;line-height: 40px;}
    #zbozi span.green {font-size: 80px;line-height: 100px;width: 100px;margin-bottom: 20px;}
    #zbozi span.sipka{display: none;}
    #zbozi span.pink{width: 85px;height: 85px;}
    #zbozi span.pink p{font-size: 15px;font-weight: normal;line-height: 15px;margin-bottom: 0;}
}

@media only screen and ( max-width: 500px ){
    #zbozi span.green{font-size: 50px;font-weight: bold;line-height: 70px;margin-right: 15px;text-align: center;width: 70px;margin-bottom: 20px;}
    #zbozi h3{font-size: 35px;line-height: 35px;padding: 0px 0 0px 0px;}
    #zbozi a.zbozi{width: 150px;}
    #zbozi span.zbozi{width: 150px;}
    #zbozi p.nadpis{font-size: 20px;}
    #zbozi p{font-size: 16px;}
    #zbozi p.cena{text-decoration: none;color: #505050; font-size: 19px; font-weight: 400;text-decoration: none;}
    #zbozi img{max-width:100px;}
    #zbozi img.sipka{display: none;}
    #santa{display: none;}
}

@keyframes rotate2 {
  30% {
    transform: rotate(0deg);
  }
  32% {
    transform: rotate(10deg);
  }
  34% {
    transform: rotate(-10deg);
  }
  36% {
    transform: rotate(10deg);
  }
  38% {
    transform: rotate(-10deg);
  }
  40% {
    transform: rotate(10deg);
  }
  42% {
    transform: rotate(-10deg);
  }
  44% {
    transform: rotate(10deg);
  }
  46% {
    transform: rotate(0deg);
  }
}

#blog{margin: 20px 0;text-align: left;}
#blog div.blog{display:block;margin-bottom: 20px;padding-bottom: 20px;}
#blog hr{border: 0;height: 1px;background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0)); margin-bottom: 20px;margin-top: 20px;}
#blog div.blog:last-child{border: none;}
#blog a{color: #f07c31;text-decoration: none;}
#blog h3{display: inline-block;text-decoration: none;color: #505050; font-size: 25px; margin-bottom: 10px;font-weight: 400;text-decoration: none;}
#blog a:hover{text-decoration: none;}
#blog a.vice{display: inline-block;text-align: center; text-decoration: none;color: #66cc33;font-size: 16px;font-weight: 400;padding: 0 10px 10px 10px;border-bottom: 2px solid #f07c31;}
#blog img{max-width:400px; float: left; margin: 0px 20px 0px 20px;}
#blog p{display: block;font-size: 17px;color: #505050;margin-bottom: 10px;}
#blog strong{font-weight: 600;}
#blog p.datum{font-size: 14px;font-weight: bold; color: #505050;margin-right: 20px;}

@media only screen and ( max-width: 900px ){
    #blog{text-align: center;}
    #blog a{text-align: center;}
    #blog img{float: none;max-width:100%;margin: 10px 0;}
    #blog p.datum{float:none;margin-right: 0px;}
}

#historie{overflow-x: hidden;align-items: center;position: relative;max-width: 1920px;margin: 0 auto;}
#historie:after{content: '';position: absolute;top: 0;left: 50%;transform: translateX(-50%);height: 100%;width: 2px;background: #66cc33;}
#historie div.licha{display: flex;justify-content: center;align-items: center;text-align: left;position: relative;width: 100%;z-index: 98;overflow: hidden;}
#historie div.licha:after{content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);height: 30px;width: 30px;border-radius: 30px;background: #66cc33;}
#historie div.suda{display: flex;justify-content: center;align-items: center;text-align: left;position: relative;width: 100%;z-index: 97;overflow: hidden;}
#historie div.suda:after{content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);height: 30px;width: 30px;border-radius: 50px;background: #66cc33;}
#historie div.licha div.img{position: relative;overflow: hidden;width: 50%;order: 2;font-size: 0;aspect-ratio: 1 / 1;margin-left: 50px;box-sizing: border-box;}
#historie div.suda div.img{position: relative;overflow: hidden;width: 50%;order: 0;font-size: 0;aspect-ratio: 1 / 1;margin-right: 50px;box-sizing: border-box;}
#historie div.licha div.text{overflow: hidden;width: 50%;box-sizing: border-box;padding: 0 100px;text-align: right;}
#historie div.suda div.text{overflow: hidden;width: 50%;box-sizing: border-box;padding: 0 100px;text-align: left;}

#historie img{position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}

#historie a{color: #f07c31;text-decoration: none;}
#historie h3{display: inline-block;text-decoration: none;color: #505050; font-size: 25px; margin-bottom: 10px;font-weight: 400;text-decoration: none;}
#historie a:hover{text-decoration: none;}
#historie a.vice{display: inline-block;text-align: center; text-decoration: none;color: #66cc33;font-size: 16px;font-weight: 400;padding: 0 10px 10px 10px;border-bottom: 2px solid #f07c31;}

#historie p{display: block;font-size: 17px;color: #505050;margin-bottom: 10px;}
#historie strong{font-weight: 600;}
#historie p.datum{font-size: 14px;font-weight: bold; color: #505050;margin-right: 20px;}

@media only screen and ( max-width: 1000px ){
    #historie div.licha div.text{padding: 0 50px;}
    #historie div.suda div.text{padding: 0 50px;}
}

@media only screen and ( max-width: 900px ){
    #historie div.licha div.text{padding: 0 25px;}
    #historie div.suda div.text{padding: 0 25px;}
    #historie img{max-width: 100%;}
}

@media only screen and ( max-width: 700px ){
    #historie img{position: relative;left: 0;top: 0;transform: none;}
    #historie p.datum{font-size: 14px;font-weight: bold; color: #505050;margin-right: 0;}
    #historie div.licha{display: block;padding-top: 60px;}
    #historie div.licha:after{top: 5%;left: 50%;transform: translate(-50%,-50%);}
    #historie div.licha div.img{width: 100%;aspect-ratio: auto;margin-left: 0px;}
    #historie div.licha div.text{width: 100%;padding: 0 ;text-align: center;background-color: white;margin-top: 20px;padding: 10px 0;}
    #historie div.suda{display: block;padding-top: 60px;}
    #historie div.suda:after{top: 5%;left: 50%;transform: translate(-50%,-50%);}
    #historie div.suda div.img{width: 100%;aspect-ratio: auto;margin-left: 0px;}
    #historie div.suda div.text{width: 100%;padding: 0 ;text-align: center;background-color: white;margin-top: 20px;padding: 10px 0;}
}

/*Menu*/
#menu{float: right;vertical-align: top;margin-top: 35px;text-align: center;position: relative;z-index: 99;}

#menu b.openbtn{border-bottom: 14px double #f07c31;border-top: 5px solid #f07c31;content:"";height: 4px;width:30px;cursor: pointer;display: none;}
#menu b.closebtn{position: absolute;top: 0;left: 15px;font-size: 36px;color: white; cursor: pointer;display: none;}
#menu b.closebtn:hover{color: #f07c31;}

#menu ul{list-style:none;float: left;}
#menu ul li{position: relative;display:inline-block; text-align: center;transition: all 300ms ease 0s;}
#menu ul li a{position: relative;z-index: 99;display: block;color: #505050;font-size: 17px;font-weight: 400;padding: 15px 5px; transition: max-height 300ms ease 0s;text-decoration: none;}
#menu ul li a.sub{position: relative;z-index: 99;color:#505050; font-weight: 400;font-size: 17px;padding: 15px 10px;background: transparent url('../img/arrow.png') center bottom no-repeat;}
#menu ul li p{position: relative;z-index: 99;color:#505050; font-weight: 400; font-size: 17px;padding: 15px 10px;background: transparent url('../img/arrow.png') center bottom no-repeat;}
#menu ul li a.edit{width: 20px; height: 20px;padding: 0 10px;background: transparent url('../img/plus.png') center bottom no-repeat;}
#menu ul li.mark a{color: #66cc33;}
#menu ul li a:hover{color: #66cc33;}

#menu ul li div.ikonka_kytice{position: absolute;right:0;top: 3px;width: 20px;}
#menu ul li div.ikonka_kytice img{width: 100%;animation: rotate3 5s infinite ease-in-out;}

@keyframes rotate3 {
  30% {
    transform: rotate(0deg);
  }
  32% {
    transform: rotate(10deg);
  }
  34% {
    transform: rotate(-10deg);
  }
  36% {
    transform: rotate(10deg);
  }
  38% {
    transform: rotate(-10deg);
  }
  40% {
    transform: rotate(10deg);
  }
  42% {
    transform: rotate(-10deg);
  }
  44% {
    transform: rotate(10deg);
  }
  46% {
    transform: rotate(0deg);
  }
}

#menu ul li a:before{content: "";position: absolute;left: 0%;bottom: 0px;height: 2px;width: 0%;background-color: #f07c31;transition: width 0.5s ease-in-out;}
#menu ul li a:after{content: "";position: absolute;right: 0%;bottom: 0px;height: 2px;width: 0%;background-color: #f07c31;transition: width 0.5s ease-in-out;}
#menu ul li a:hover:before{width:50%}
#menu ul li a:hover:after{width:50%}
#menu ul li a.sub:before{content: none;}
#menu ul li a.sub:after{content: none;}
#menu ul li a.edit:before{content: none;}
#menu ul li a.edit:after{content: none;}

#menu li ul{list-style:none; position: absolute;visibility: hidden;overflow: hidden;padding-bottom:15px;max-height:0px;top:50px;background-color: white;border-bottom: 2px solid #f07c31;width: 200%;margin: 0 0 0 -50%;transition: all 0.5s ease-in-out;}
#menu li:hover ul{max-height: 500px;visibility: visible;}
#menu li ul li{margin: 0px;padding: 0;display: block;vertical-align: top;}
#menu li ul li a{color:#505050;display: inline-block;font-weight: 400; font-size: 17px;padding: 10px;background-color: white;}
#menu li.mark ul li a:hover{color: #66cc33;}
#menu li.unmark ul li a:hover{color: #66cc33;}
#menu li.mark ul li a{color: #505050;}

@media only screen and ( max-width: 1200px ){
    #menu{margin-top: 47px;}
    #menu ul{float: none;}
    #menu b{display: inline-block!important;}
    #menu ul li ul{background: none;border-bottom: 2px solid #f07c31;}
    #menu ul li ul li a{color:white;background: none;}
    #menu ul li{display:block;background: none;padding-right: 0;padding-left: 0;}
    #menu ul li a{color:white;}
    #menu ul li p{color:white;}
    #menu ul li a.sub{color:white;}
    #menu ul li a:before{content: none;}
    #menu ul li a:after{content: none;}
    #menu ul li.mark a{color: #f07c31;}
    #menu ul li.mark ul li a{color: white;}
    #menu ul li a:hover{color: #f07c31;}
    #menu li ul{position: relative;top:0px;padding: 0;width: 100%;margin: 0;}
    #menu .nav{height: 100%;width: 200px;position: fixed;z-index: 1;top: 0;right: -200px;background-color: rgba(0,0,0,0.8);overflow-x: hidden;padding-top: 60px;transition: 0.5s;}

    #menu ul li div.ikonka_kytice{display: none;}
    #menu ul li div.ikonka_kytice img{display: none;}
}

@media only screen and ( max-width: 700px ){
    #menu{margin-top: 47px;margin-right: 20px;}
}

/*Podmenu*/
#podmenu{text-align: center;}
#podmenu a{font-size: 17px; font-weight: 400;text-decoration: none!important;margin: 0 10px 10px 10px;}
#podmenu a:hover{text-decoration: underline!important;}

/*Podskupiny*/
#podskupiny{position: relative;text-align: center;}
#podskupiny a{display: inline-block;color:#66cc33;font-size: 15px;font-weight: 300;text-decoration: none;margin: 10px;padding: 0 10px 10px 10px;box-sizing: border-box;border-bottom: 2px solid #f07c31;}
#podskupiny a:hover{text-decoration: none;}

/* LOGIN */
#login{width: 300px; margin: 0 auto;}
#login h3{text-align: left;font-size: 15px;color: #666666;font-weight: bold;}
#login input[type=submit]{background-color: #666666;border:1px solid #666666;}
#login input[type=submit]:hover{background-color: white; color: #546a76; transition: all 300ms ease 0s;}
#login label{width: 100px;color: #666666;}

/*Search form*/

/*Registrace*/

/*napoveda*/

/*Nevim heslo*/
#nevim-heslo {width: 350px;}
#nevim-heslo a{color: white;}
#nevim-heslo input.button{position: relative; top: -5px;}

/*loader*/
.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}

/*POPUP HLAVNI*/
#popup{top: 0;left:0;right: 0;bottom: 0;position: fixed;z-index: 998;z-index: 888888888;width: 100%;height:100%;background-color: rgba(0,0,0,0.6);}
#popup div.popup_content{background: #fff;text-align: center;padding: 0;position: relative;z-index: 999;top:50%;transform: translateY(-50%);max-width: max-content;font-size: 0;
    box-sizing: border-box;border-radius: 10px;-webkit-border-radius: 10px;-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-backface-visibility: visible;-ms-backface-visibility: visible;
    backface-visibility: visible;-webkit-animation-name: popup;animation-name: popup;margin: 0 auto;}
#popup div.popup_content img{display: block;max-width: 100%;height: auto!important;}

#popup div.circle{background-color: #ff99cc;border-radius: 50%;max-width: 400px;height: 400px;}
#popup div.circle p{position: absolute;color:#fff;top:50%;left:50%;transform: translate(-50%, -50%);}

/*POPUP INFO*/
div.popup{top: 0;left:0;right: 0;bottom: 0;position: fixed;z-index: 998;z-index: 888888888;width: 100%;height:100%;background-color: rgba(0,0,0,0.6);}
div.popup_content{background: #fff;text-align: center;padding: 50px;position: relative;z-index: 999;top:50%;transform: translateY(-50%);max-width: 1200px;
    box-sizing: border-box;border-radius: 10px;-webkit-border-radius: 10px;-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-backface-visibility: visible;-ms-backface-visibility: visible;
    backface-visibility: visible;-webkit-animation-name: popup;animation-name: popup;margin: 0 auto;}

div.popup_content h3{float: none!important;text-align: center!important;}
div.popup_content p{color: #66cc33; font-size: 30px;}
div.scroll{max-height: 80vh;overflow-y: scroll;}
div.svatky{display: inline-block;}

@media only screen and ( max-width: 1200px ){
    div.popup_content{width:auto;max-width: 1200px;}
}

@media only screen and ( max-width: 500px ){
    div.popup_content{padding: 50px 5px 10px 20px;}
    #zbozi div.popup_content img{width:100%;max-width: none;}
}

/* OBJEDNAVKA */
#objednavka{display: flex;}

#rekapitulace{text-align: center;}
#rekapitulace div.step{position: relative;text-align: center;width: 100%;}
#rekapitulace div.step h3 {font-family: 'Kalam', cursive;text-align: left;font-size: 45px;letter-spacing: -2px;font-weight: 300;padding: 35px 0 0px 0px;margin: 0px;}
#rekapitulace img.sipka {position: absolute;top: 170px;left: 0;}
#rekapitulace div.box{/*padding-left: 80px;*/}
#rekapitulace form{text-align: center;}
#rekapitulace input.objednat{cursor: pointer;padding: 15px 100px;font-size: 15px;font-weight: 600;border-radius: 10px;background-color: #71b73b;border: 2px solid white;color: white;margin-bottom: 0px;animation: shake-ball 4.72s ease infinite;}
#rekapitulace input.objednat:hover{background: none;border: 2px solid #71b73b;color: #505050;}

@keyframes shake-ball {
   0% { transform:translate(0,0) }
  1.78571% { transform:translate(5px,0) }
  3.57143% { transform:translate(0,0) }
  5.35714% { transform:translate(5px,0) }
  7.14286% { transform:translate(0,0) }
  8.92857% { transform:translate(5px,0) }
  10.71429% { transform:translate(0,0) }
  100% { transform:translate(0,0) }
}

#rekapitulace input.zpet{cursor: pointer;padding: 0px;font-size: 15px;font-weight: 600;border-radius: 10px;background-color: #fd4778;border: 2px solid white;padding:5px 50px;color: white;margin-bottom: 10px;}
#rekapitulace input.zpet:hover{background: none;border: 2px solid #fd4778;color: #505050;}
#rekapitulace p{text-align: left;font-size: 15px;word-wrap: break-word;overflow-wrap: break-word;}
#rekapitulace p.nadpis{text-align: left;font-size: 23px;color:#71b73b;margin-bottom: 10px;}
#rekapitulace img.kytice{float: right;width:130px;margin-right: 20px;}
#rekapitulace div.bloky{display: inline-block;width: 280px;vertical-align: top;margin:0 10px;box-shadow: 1px 1px 10px 0 rgba(50, 50, 50, 0.08);padding: 20px;}

#rekapitulace span.green{
    float: left;
  background: #71b73b;
   border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  font-size: 100px;
  font-weight: bold;
  line-height: 150px;
  margin-right: 15px;
  text-align: center;
  width: 150px;
}

@media only screen and ( max-width: 500px ){

    #rekapitulace div.step h3{font-size: 30px;line-height: 30px;padding: 0 0 0 0;}
    #rekapitulace div.box{padding-left: 0px;}
    #rekapitulace div.bloky{text-align: center;display: inline-block;width: 100%;vertical-align: top;margin:10px 0;}
    #rekapitulace div.bloky p{text-align: center;}
    #rekapitulace div.bloky p.nadpis{text-align: center;}
    #rekapitulace img.kytice{float: none;width:200px;margin-right: 0px;}
    #rekapitulace img.sipka{display: none;}
    #rekapitulace span.green{font-size: 50px;font-weight: bold;line-height: 70px;margin-right: 15px;text-align: center;width: 70px;margin-bottom: 20px;}
}

#right_side{position: relative;width: 250px;padding-left: 20px;box-sizing: border-box;}

#right_side div.float_element{position: sticky;top: 20px;}

#right_side span.green{
    position: absolute;
    margin-top: 40px;
  background: #ff99cc;
   border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  font-size: 20px;
  font-weight: normal;
  line-height: 20px;
  padding-top: 70px;
  text-align: center;
  box-sizing: border-box;
  width: 250px;
  height: 250px;
}

#right_side span.green2{
    position: absolute;
    margin-top: 250px;
    margin-left: 100px;
    background: #71b73b;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    color: #ffffff;
    display: inline-block;
    font-size: 20px;
    font-weight: normal;
    line-height: 20px;
    padding-top: 12px;
    text-align: center;
    box-sizing: border-box;
    width: 130px;
    height: 130px;
}

#right_side span.green2 p{color: #ffffff;}

#right_side span.pink{
    position: absolute;
  background: #71b73b;
   border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  font-size: 16px;
  font-weight: normal;
  line-height: 16px;
  padding-top: 25px;
  text-align: center;
  box-sizing: border-box;
  width: 100px;
  height: 100px;
  z-index: 99;
}

#right_side span.pink p{color: #ffffff;}

#right_side span.pink2{
  background: #f77fba;
}

@keyframes shake-ball {
   0% { transform:translate(0,0) }
  1.78571% { transform:translate(5px,0) }
  3.57143% { transform:translate(0,0) }
  5.35714% { transform:translate(5px,0) }
  7.14286% { transform:translate(0,0) }
  8.92857% { transform:translate(5px,0) }
  10.71429% { transform:translate(0,0) }
  100% { transform:translate(0,0) }
}

@keyframes shake-animation {
  10% {
    transform: rotate(0deg);
  }
  15% {
    transform: rotate(3deg);
  }
  20% {
    transform: rotate(-3deg);
  }
  25% {
    transform: rotate(3deg);
  }
  30% {
    transform: rotate(0deg);
  }
}

#right_side span.green p{color: white;margin: 0;font-size: 22px;font-weight: normal;line-height: 20px;}
#right_side span.green p.cena{font-size: 35px;font-weight: bold;margin: 10px 0;}

#okruhy{overflow: hidden;}
#okruhy h3{margin-top: 20px;text-align: center;font-family: 'Kalam', cursive;font-size: 45px;font-weight: 300;}
#okruhy p{text-align: center;margin-bottom: 20px;text-align: center;color:#505050;font-size: 25px;font-weight: 300;}
#okruhy div{height:450px; width:100%; display:inline-block; overflow:hidden;}

@media only screen and ( max-width: 500px ){
    #okruhy h3{font-size: 35px;}
    #okruhy div{height:300px;}
}

/*#cenovka{position: fixed;width: 250px;height: 250px;padding: 108px 0 0 80px;background: transparent url('../img/cenovka.png') no-repeat;box-sizing: border-box;}
#cenovka p{color:white;font-size: 25px;font-weight: bold;letter-spacing: -0.5px;}*/

#left_side{text-align: center;flex: 1;}
#left_side form{text-align: center;}
#left_side p{text-align: left;}

#left_side span.green{
    float: left;
  background: #71b73b;
   border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  color: #ffffff;
  display: inline-block;
  font-size: 100px;
  font-weight: bold;
  line-height: 150px;
  margin-right: 15px;
  text-align: center;
  width: 150px;
}

#left_side div.cena{
  float: right;
  position: relative;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  width: 45px;
  height: 45px;
  margin: 5px;
}

#left_side div.cena_big{
  float: right;
  position: relative;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  width: 60px;
  height: 60px;
  margin: 10px;
}

#left_side div.cena span{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: /*#71b73b*/#ffffff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    color: #808080;
    font-size: 15px;
    font-weight: bold;
    line-height: 45px;
    text-align: center;
    width: 45px;
    transition: ease .3s;
    box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);
}

#left_side div.cena_big span{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: #ffffff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    color: #b9b9b9;
    font-size: 15px;
    font-weight: bold;
    line-height: 60px;
    text-align: center;
    width: 60px;
    transition: ease .3s;
    box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);
}

#objednavka img.kytice{height: 350px;}
#objednavka img.number{float: left;width: 250px;}
#objednavka img.sipka{position: absolute;top: 170px; left: 0;}
#objednavka h3{font-family: 'Kalam', cursive;text-align: left;font-size: 45px;line-height: 45px;letter-spacing: -2px;font-weight: 300;padding: 35px 0 0px 0px;margin: 0px;}

#objednavka p {color: #505050;font-size: 16px;margin-bottom: 20px;}
#objednavka p.nadpis{text-align: center;font-size: 25px;margin-bottom: 30px;}

#objednavka div.step{margin-bottom: 50px;position: relative;}
#vyzvednuti{display: none;margin-bottom: 250px;}

.popisek{color: #505050;font-size: 15px;margin:10px;}
#popisek2{display: none; color: #E21A1A;}
#popisek3{margin-top: 30px!important;display: none; color: #E21A1A;}
#popisek4{display: none; color: #E21A1A;}
#popisek5{display: none; color: #E21A1A!important;}
.error{color: #E21A1A!important;}
.neaktivni{opacity: 0.5;}

span.info{color: #66cc33;cursor: pointer;background: transparent url('../img/info.png') top right no-repeat;padding: 10px 15px 0 0;border:none;}
span.close{position: absolute;right: 10px;top:10px;height: 20px; width:20px;font-size: 0px;background: transparent url('../img/cross.png') no-repeat;border:none;cursor: pointer;}

#Volani{display: none;}

.input-container {
    width: 260px;
    display: inline-block;
    position: relative;
    margin: 5px;
}

.input-container .radio-button {
      opacity: 0;
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      margin: 0;
      cursor: pointer;
}

.input-container .radio-tile {
     background-color: #f4f4f4;
      border: 1px solid #f0f0f0;
      border-radius: 5px;
      padding: 10px;
      transition: transform 300ms ease;
}

.input-container .radio-tile label {
      text-align: center;
      font-size: 12px;
      font-weight: 600;
      color: #505050;
    }

.input-container .radio-button:checked + .radio-tile {
      background-color: #71b73b;
      border: 1px solid #71b73b;
      color: white;
      transform: scale(1.02);
}

.input-container .radio-button:checked + .radio-tile label {
    color: white;
}

.round {position: relative;color:#505050;display: inline-block;padding-left: 40px;vertical-align: middle;margin-right: 10px;margin-bottom: 20px;box-sizing: border-box;}

.souhlas {padding: 5px 0;padding-left: 50px;}

.vertical {display: block;margin-top: 15px;margin-bottom: 0;padding-top: 0px;vertical-align: top;}

.round p{display: inline-block;vertical-align: middle;margin:0!important;}

.round label {background-color: #fff;border: 1px solid #ccc;border-radius: 50%;cursor: pointer;height: 28px;left: 0;position: absolute;top: 0;width: 28px;}
.souhlas label {height: 35px;width: 35px;}

.round label:after {border: 2px solid #fff;border-top: none;border-right: none;content: "";height: 6px;left: 7px;opacity: 0;position: absolute;top: 8px;transform: rotate(-45deg);width: 12px;}
.souhlas label:after {left: 11px;top: 11px;}

.round input[type="checkbox"] {display: none;}

.round input[type="radio"] {display: none;}

.round input[type="checkbox"]:checked + label {background-color: #71b73b;border-color: #71b73b;}

.round input[type="checkbox"].required:invalid + label{background-color: #ffdddd;}

.round input[type="radio"]:checked + label {background-color: #71b73b;border-color: #71b73b;}

.round input[type="radio"].required:invalid + label{background-color: #ffdddd;}

.round input[type="checkbox"]:checked + label:after {opacity: 1;}

.round input[type="radio"]:checked + label:after {opacity: 1;}

#objednavka input[type=submit]{cursor: pointer;padding: 15px 100px;font-size: 15px;font-weight: 600;vertical-align: middle;border-radius: 10px;-webkit-appearance: none;background-color: #71b73b;border: 2px solid white;color: white;margin-bottom: 0px;transition: all 0.5s;animation: shake-ball 4.72s ease infinite;}
#objednavka input[type=submit]:hover{background: none;border: 2px solid #71b73b;color: #505050;}

#objednavka input[type=submit]:disabled{cursor: default;background-color: #909090;animation: none;}
#objednavka input[type=submit]:disabled:hover{background-color: #909090;border: 2px solid white;color: white;}

@keyframes shake-ball {
   0% { transform:translate(0,0) }
  1.78571% { transform:translate(5px,0) }
  3.57143% { transform:translate(0,0) }
  5.35714% { transform:translate(5px,0) }
  7.14286% { transform:translate(0,0) }
  8.92857% { transform:translate(5px,0) }
  10.71429% { transform:translate(0,0) }
  100% { transform:translate(0,0) }
}

#objednavka input[type="checkbox"][name="color[]"]{display: none;}
#objednavka input[type="checkbox"][name="stuha"]{display: none;}
#objednavka input[type="checkbox"][name="cokolada[]"]{display: none;}

#objednavka label{display: inline-block;color: #505050;font-size: 18px;font-weight: 600;text-align: center;}
#objednavka label p{color: #505050;font-size: 17px;text-align: center;}
#objednavka label.hidden{display: none;}
#objednavka input[type="text"],#objednavka input[type="search"]{position: relative;color: #505050;border: 0px solid #dbdbdb;border-radius: 5px;padding: 10px;box-sizing: border-box;resize: none;box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);-webkit-appearance: none;}
#objednavka input[type="email"]{color: #505050;border: 0px solid #dbdbdb;border-radius: 5px;padding: 10px;box-sizing: border-box;resize: none;box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);-webkit-appearance: none;}

/*#objednavka input::placeholder {transition: all 0.9s;}
#objednavka input:focus::placeholder {transform: translateX(calc(100% - 200px));}*/

#objednavka input::placeholder {text-align: left;}
#objednavka input:focus::placeholder {text-align: right;}

#ares {
  text-align: center;
  display: none;
  color: white;
  cursor: pointer;
  text-decoration: none;
  padding: 9px 5px;
  outline: none;
  border-style: solid none;
  border-color: #73dd23 #000 #40840e;
  border-radius: 5px;
  background: linear-gradient(#74d828, #71b73b) #71b73b;
  transition: 0.2s;
  margin-left: 5px;
  font-size: 14px;
}
#ares:hover { background: linear-gradient(#71b73b, #71b73b) #71b73b; }
#ares:active { background: linear-gradient(#71b73b, #71b73b) #71b73b; }

#objednavka div.box{float: right;position: relative;width: 700px;}
#ajax_loader{display: none;background: transparent url('../img/ajax-loader.gif') center center no-repeat;width: 100%;height: 100%;position: absolute;z-index: 98;}

#adresa{display: none;}
#FaktFirm{display: none;}
#FaktIc{display: none;width: 85%;}
#FaktDic{display: none;}
#kopirovani{display: none;}

#objednavka textarea{width:100%;background: #fff;color:#505050;border: 0px solid #dbdbdb;border-radius: 5px;padding: 10px;box-sizing: border-box;resize: none;box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);-webkit-appearance: none;}

.counter{position:relative;}
.word-counter{position:absolute;bottom: 5px;right:5px;}

#objednavka select{color:#505050;font-size: 16px;/*width: 100%;*/border: 0px solid #dbdbdb;box-sizing: border-box;border-radius: 5px;padding: 10px;box-shadow: 0 2px 5px 0 rgba(50, 50, 50, 0.3);-webkit-appearance: none;}

#cas option.hour:disabled{display: none;}
#cas option.twohour:disabled{display: none;}

#objednavka label.cokolada{width:130px;margin:20px 0;}
#objednavka label.big{width:130px;margin:20px 10px;}
#objednavka label.biger{width:250px;margin:20px 10px;}
#objednavka .cokolada img{cursor: pointer;width: 100%;margin-bottom: 10px;transition: all 0.5s;}
#objednavka .cokolada div{float: none;}
#objednavka .cokolada input:hover ~ img{transform: scale(1.2);}
#objednavka .cokolada input:checked ~ img{transform: scale(1.2);}
#objednavka .cokolada input:checked ~ div.cena span{padding: 5px;background: #ff99cc; color: #ffffff;}

#objednavka .zasilkovna{display: inline-block;vertical-align: middle;margin-right: 10px;margin-bottom: 20px;}
#objednavka .zasilkovna_button{background-color: #71b73b;padding: 5px 10px;border: 2px solid white;border-radius: 10px;color: white;font-size: 16px;cursor: pointer;margin-bottom: 5px;transition: all 0.5s;}
#objednavka .zasilkovna_button:hover{background: none;border: 2px solid #71b73b;color: #505050;}

.color_button {
  display: inline-block;
  position: relative;
  width: 40px;
  height: 40px;
  margin: 10px;
  cursor: pointer;
}

.color_button span {
  display: block;
  position: absolute;
  width: 40px;
  height: 40px;
  padding: 0;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 100%;
  background: #eeeeee;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  transition: ease .3s;
  font-size: 29px;
  font-weight: 800;
}

.color_button span:hover {padding: 10px;}
input:checked ~ div.color_button span{padding: 10px;}

.white .color_button span {background: #ffffff;}
.black .color_button span {background: #000000;}
.orange .color_button span {background: #ff9900;}
.red .color_button span {background: #e60000;}
.purple .color_button span {background: #9900cc;}
.pink .color_button span {background: #ff80ff;}
.yellow .color_button span {background: #ffff00;}
.green .color_button span {background: #00cc00;}
.mix .color_button span {background: transparent url('../img/mix.png') no-repeat;background-size:cover;}
.white_gold .color_button span {background-color: #ffffff;color:#d4af37;}
.white_silver .color_button span {background-color: #ffffff;color:#c0c0c0;}
.black_gold .color_button span {background-color: #000000;color:#d4af37;}
.black_silver .color_button span {background-color: #000000;color:#c0c0c0;}

.sprava input {display: none;}
.sprava .color_button{width: 30px;height: 30px;margin: 5px;}
.sprava .color_button span{width: 30px;height: 30px;}
.sprava .color_button span:hover{padding: 5px;}
.sprava input:checked ~ div.color_button span{padding: 5px;}

@media only screen and ( max-width: 1200px ){
    #left_side span.green{font-size: 80px;line-height: 100px;width: 100px;margin-bottom: 20px;}
    #objednavka img.sipka{display: none;}
}

@media only screen and ( max-width: 1000px ){
    #objednavka{display: block;}
    #left_side{padding: 0 50px;}
    #right_side{display: none;}
    #objednavka div.box {float: none;width: 100%;}
}

@media only screen and ( max-width: 800px ){
    #objednavka div.box{float: none;width: 100%;}
    #objednavka h3{font-size: 40px;line-height: 40px;padding: 0 0 0 0;}
    #objednavka .round{width: 100%;}
}

@media only screen and ( max-width: 700px ){
    #objednavka select.select_datum{width: 100%;}
    #objednavka select.select_cas{width: 100%;}
}

@media only screen and ( max-width: 500px ){
    #left_side span.green{font-size: 50px;line-height: 70px;width: 70px;margin-bottom: 20px;}
    #left_side{padding: 0px;}
    #objednavka h3{font-size: 30px;line-height: 30px;padding: 0 0 0 0;}
    #objednavka div.box{float: none;width: 100%;}
    #objednavka .button{width: 30px;height: 30px;margin: 3px;}
    #objednavka .button span{width: 30px;height: 30px;}
    #objednavka .button span:hover{padding: 5px;}
    #objednavka input:checked ~ div.button span{padding: 5px;}
    #objednavka img.kytice{height: 200px;}
    #objednavka img.sipka{display: none;}
    #objednavka div.step{margin-bottom: 40px;}
    #objednavka label.cokolada{width:80px;margin: 10px 0;}
    #objednavka label.big{width:100px;margin: 10px 0;}
    #objednavka label.biger{width:180px;margin: 10px 0;}
    #objednavka .select2-container{width:100%!important;}
    #objednavka .round{width: 100%;}
    #FaktIc{width: 72%;}
}

#platba{text-align: center;}
#platba div.arrow1{display: inline-block;width: 350px;vertical-align: middle;text-align: left;}
#platba div.arrow2{display: inline-block;width: 850px;vertical-align: middle;text-align: left;}
#platba h1{font-family: 'Kalam', cursive;font-size: 60px;font-weight: 300;}
#platba p{font-size: 18px;line-height: 200%;color: #505050;}
#platba p.center{text-align: center;}
#platba span{font-size: 30px;font-weight: 900;line-height: 200%;border:1px solid #505050;border-radius:5px;padding:5px;}
#platba form {text-align: center;}
#platba input.objednat{cursor: pointer;padding: 15px 100px;font-size: 15px;font-weight: 600;border-radius: 10px;background-color: #71b73b;border: 2px solid white;color: white;margin-bottom: 0px;animation: shake-ball 4.72s ease infinite;}
#platba input.objednat:hover{background: none;border: 2px solid #71b73b;color: #505050;}

#platba .platba{cursor: pointer;padding: 10px;width: 320px;margin-bottom: 10px;font-size: 15px;font-weight: 600;border-radius: 10px;background-color: #f4f4f4;border: 1px solid #e8e8e8;color: #5a5a5a;}
#platba .platba:hover{background-color: #e8e8e8;border: 1px solid #e8e8e8;color: #5a5a5a;}
#platba .platba img{max-height: 100%;}

@media only screen and ( max-width: 500px ){
    #platba div{width: 280px;}
}

/* FORMULAR */
#formular{width: 800px;}
#formular h3{color: #66cc33;text-align: center;font-size: 25px;font-weight: 300;margin-bottom: 20px;}
#formular p{text-align: center; font-weight: 400;font-size: 15px;color: #505050;margin-bottom: 20px;}
#formular table{width: auto;}
#formular td{text-align: center;font-size: 15px;color: #505050;margin-bottom: 20px;padding: 2px;}
#formular th{text-align: center;font-size: 15px;color: #505050;margin-bottom: 20px;padding: 2px;}
#formular p.small{font-size: 13px;}
#formular label{text-align: right; font-weight: 400;font-size: 15px;color: #505050;}
#formular form input{color: #505050; background: none;border: 1px solid #505050;border-radius: 0;margin-bottom: 7px;}
#formular form select{color: #505050; background: none;border: 1px solid #505050;border-radius: 0;margin-bottom: 7px;}
#formular form textarea{color: #505050; background: none;border: 1px solid #505050;border-radius: 0;}
#formular input[type=submit]{font-size: 15px;font-weight: 600;border-radius: 0;background-color: #66cc33;border: 2px solid white;color: white;margin-bottom: 0px;}
#formular input[type=submit]:hover{background: none;border: 2px solid #66cc33;color: #505050;}

@keyframes popup {
0% {

    transform: translateY(-50%) perspective(800px) rotateY(90deg);
    opacity: 0;
}
40% {

    transform: translateY(-50%) perspective(800px) rotateY(-10deg);
}
70% {

    transform: translateY(-50%) perspective(800px) rotateY(10deg);
}
100% {

    transform: translateY(-50%) perspective(800px) rotateY(0deg);
    opacity: 1;
}
}

/*range*/
.range-div {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: calc(100% - 130px);
}

.range-plus{
  width:61px;
  height:50px;
  /*border-radius:30px;
  border:none;
  color: white;
  font-size: 40px;
  line-height: 22px;
  background: #eeeeee;*/
  background: transparent url('../img/sipka_plus.png') no-repeat;
  filter: grayscale(100%);
  opacity: 0.3;
  display: inline-block;
  cursor: pointer;
  box-sizing: border-box;
  vertical-align: middle;
}

.range-minus{
  width:61px;
  height:50px;
  /*border-radius:30px;
  border:none;
  color: white;
  font-size: 40px;
  line-height: 22px;
  background: #eeeeee;*/
  background: transparent url('../img/sipka_minus.png') no-repeat;
  filter: grayscale(100%);
  opacity: 0.3;
  display: inline-block;
  cursor: pointer;
  box-sizing: border-box;
  vertical-align: middle;
}

.enabled{
    filter: grayscale(0%);
    opacity: 1;
}

.range {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #dbdbdb;
  width: 100%;
  height: 3px;
  outline: none;
  vertical-align: middle;
}

.range:active::-webkit-slider-thumb {
  box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.4);
}

.range:active::-moz-range-thumb {
  box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.4);
}

.range::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 80px;
  width: 80px;
  background: #eeeeee;
  border-radius: 80px;
  border:none;
  cursor: grab;
}

.enabled::-webkit-slider-thumb {
  background: #71b73b;
}

.range::-moz-range-thumb {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  height: 80px;
  width: 80px;
  background: #eeeeee;
  border-radius: 80px;
  border:none;
  cursor: grab;
}

.enabled::-moz-range-thumb {
  background: #71b73b;
}

.range-thumb {
  position: absolute;
  left: 0px;
  /* half :thumb width */
  top: 0;
  width: 83px;
  /* same as :thumb */
  height: 30px;
  /* same as :thumb */
  text-align: center;
  color: #fff;
  line-height: 30px;
  font-size: 30px;
  font-weight:800;
  pointer-events: none;
  /* ignore mouse */
}

.range-thumb::before {
  content: attr(data-val) " ";
}

/*facebook*/
#facebook_side{transition: left 0.5s;position:fixed;z-index:9999;top:50%;width: 300px;left:-300px;top:200px;}
#facebook_side img.flag{position: absolute;right: -50px;}

/*instagram*/
#instagram_side{background-color: white;transition: left 0.5s;position:fixed;z-index:9998;top:50%;width: 300px;left:-300px;top:260px;padding-bottom: 50px;}
#instagram_side img.flag{position: absolute;right: -50px;}

@media only screen and ( max-width: 600px ){
    #facebook_side{display: none;}
    #instagram_side{display: none;}
}

/*cookies*/
.cookies_trigger{cursor: pointer;position: fixed;bottom: 0;left: 0;z-index: 99;height: 50px;width: 50px;background: #71b73b url('../img/cookies.png') center center no-repeat;border: none;}
#cookies_popup{display: none;top: 0;left:0;right: 0;bottom: 0;position: fixed;z-index: 998;z-index: 888888888;width: 100%;height:100%;background-color: rgba(0,0,0,0.6);}
#cookies_popup_consent{
    position: absolute;z-index: 999;bottom:0;left:0;
    max-width: 600px;
    background-color:white;
    padding:20px;
    z-index:1000;
    box-sizing: border-box;
}

#cookies_extend{display: none;}

#cookies_popup_consent h1{
    color: #71b73b;
    font-size:1.2em;
    text-transform: uppercase;
}
#cookies_popup_consent h1:before{
    content:"";
    padding:0;
}

#cookies_popup_consent a{
    color: #71b73b;
    text-decoration: underline;
}

#cookies_popup_consent p{
    font-size:12px;
    color: #71b73b;
}

#cookies_popup_consent span.nadpis{
    font-size:0.8em;
    font-weight: 600;
    color: #71b73b;
}

#cookies_popup_consent form{
    /*text-align: center;*/
}

#cookies_popup_consent button[type="submit"] {
    float: right;cursor: pointer;border: none;background-color: #71b73b;color: white;padding: 10px;margin: 5px;font-size: 12px;font-weight:600;text-transform: uppercase;
}

#cookies_popup_consent button[type="button"] {
    float: right;cursor: pointer;border: none;background: none;color: #71b73b;padding: 10px;margin: 5px;font-size: 12px;font-weight:600;text-decoration: underline;
}

.switch {
    float: right;
    font-size: 100%;
    height: 1.6em;
    position: relative;
}

.switch > input[type="checkbox"] {
    display: none;
}

.switch .switch-style {
    height: 1.6em;
    left: 0;
    background: #C0CCDA;
    -webkit-border-radius: 0.8em;
    border-radius: 0.8em;
    display: inline-block;
    position: relative;
    top: 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    width: 3em;
    cursor: pointer;
}

.switch > input[type="checkbox"]:checked + .switch-style {
    background-color: #71b73b;
}

.switch .switch-style:before {
    display: block;
    content: '';
    height: 1.4em;
    position: absolute;
    width: 1.4em;
    background-color: #fff;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    left: 0.1em;
    top: 0.1em;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.switch > input[type="checkbox"]:checked + .switch-style:before {
    left: 50%;
}

.more > input[type="checkbox"] {
    display: none;
}

.more .more-more {
    position: relative;
}

.more .more-more p{
    display: inline-block;
    font-size:12px;
    height: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
}

.more .more-more:before {
    display: block;
    content: '+';
    color: #71b73b;
    font-size: 20px;
    position: absolute;
    left: 0;
    top: 0;
}

.more > input[type="checkbox"]:checked + .more-more:before {
    content: '-';
}

.more > input[type="checkbox"]:checked + .more-more p{
    height: auto;
    visibility: visible;
}