/* Colour guide:
Nadpisy: Chili Pepper #98173b -> Surf The Web #203d83
Box body: Petal Poise #f7dfe9 -> Alice Blue #e9f3ff
Box border: Very Berry #b33078 - > Cottage Blue #7699c4
BG color: Plum Royale #866d79 -> #649f46
*/

/* tagy */
body {margin: 0 auto; padding: 0; background: #8399ce fixed; text-align: left; font-family: "Arial",Helvetica,sans-serif; font-size: 0px; font-weight: 500; color:#000;}
a {color: #053a98; text-decoration: underline; cursor: hand;}
h1 {height:33px;font-size:24px; margin:0; font-family: Patrick Hand SC,cursive;letter-spacing:1px;color:#39599f/*2d2532*/;text-align: center; padding: 10px 0 0 0; margin-top: 10px;}
h2{letter-spacing: 0px;font-size:20px;font-weight:normal;margin:5px 0 0 0; border-bottom: 1px dotted gray;}
h3{letter-spacing: 0px;font-size:20px;font-weight:bold;margin:5px 0 3px 0; color:#545051;}    
h4{font-size:16px; margin:0; padding: 5px 0 3px 0; margin: 0px;font-family: Ribeye, Trebuchet MS; letter-spacing: 1px;color:#103992;text-align: center;}
h6{margin:0; font-size:13px;font-weight:normal;}     
  

/* Tělo vycentrované na střed / 980px*/
#telo  {margin: 0 auto; width: 1120px; font-family: Georgia; font-size: 14px; line-height: 125%;}
#telo-bg {background-image: url(../images/bg2.png); background-repeat: repeat-y; }

/*#hlavicka ul{float:left;margin:0;list-style:none; position:relative;top: 170px; left:190px;}*/
#hlavicka ul{text-align:center;margin:0;list-style:none; position:relative;top: 220px; padding-right: 50px/*padding-left:250px*/;}
#hlavicka li{display:inline;}
#hlavicka ul a{display:/*block*/ inline;/*float:left;*/text-align:center; color: #103992;margin:0 0 0 5px;
height:25px;padding:12px 10px 0 10px; background:transparent; text-decoration:none;font-weight:bold; font-family: arial; font-size: 14px}

/* Levý sloupec, zacentrovaný do leva */
#levy-sloupec {width: 215px; float: left; min-height: 200px; /*padding: 0px 15px;*/}
#levy-sloupec h3{width:175px;height:auto;background: url(../images/nadpismenu.png); background-repeat: no-repeat; padding: 7px 5px 0 0; margin:0;
font-size:16px;color:#545051;text-align: center;text-shadow: 0 0 3px #C0D4ED;}
#levy-sloupec ul{padding-left:0;list-style:none none outside;}
#levy-sloupec li{padding:1px 0 0 5px;}
.levy    {padding: 0 5px 0 15px;}

/* Pravý sloupec, zacentrovaný do leva */
#pravy-sloupec {width: 215px; float: right; min-height: 200px;}
#pravy-sloupec h3{width:175px;height:auto;background: url(../images/nadpismenu.png); background-repeat: no-repeat; padding: 7px 5px 0 0; margin:0;
font-size:16px;color:#545051;text-align: center;text-shadow: 0 0 3px #203d83;}
#pravy-sloupec ul{padding-left:0;list-style:none none outside;}
#pravy-sloupec li{padding:1px 0 0 5px;}
.pravy     {padding:0 5px 0 15px;}

/* Obsah */
#obsah {width: 690px; float: left; min-height: 200px; margin:0 auto;}
/*narozky border*/
#obsah p {border: 1px solid #a6bbe2; margin: 10px; background-color: #dee7ff; padding: 7px; width: auto;border-radius: 2px;}
.wrap   { padding: 0 15px;  }
#obsah pmista {border: 1px solid #9eb9da; margin: 10px; background-color: #C0D4ED; padding: 7px; width: auto; border-radius: 2px;}


#hlavicka {background-color: transparent; background-image: url(../images/header.png); background-position: top; margin:0;}
margin: 0 auto; width: 1120px; font-family: Georgia; font-size: 14px; line-height: 125%;}
#obsah {background-color: transparent; background-image: url(...); background-repeat: no-repeat;}
#levy-sloupec {background-color: transparent; background-image: url(../images/menu12.png); background-repeat: no-repeat;}
#pravy-sloupec {background-color: transparent; background-image: url(../images/menu22.png); background-repeat: no-repeat;}
#paticka {background-color: transparent; background-image: url(../images/footer2.png); background-repeat: no-repeat; color: #bdd3ff;}
#paticka a{color: #203d83;}*/
.hint {color: #000;}


/*body, html{
    height: auto;
    height: 100%;
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
    
}
    
.container {
    background-image: url('../images/background3-3.png');
        background-position: top;       
        background-repeat: no-repeat;
        background-size: contain;
        width: auto;
        top: 50%; 
        left: -50%; 
        width: 120%; 
}

@media (min-width: 1030px) {
    .container {
        background-image: url('../images/background4.png');
        background-position: top;
        background-repeat: no-repeat;
        background-size: contain;
        width: auto;
        width: 100%;
    }
} */

body, html{
    height: auto;
    height: 100%;
    background-position: top;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: contain;
    
}
    
.container {
        width: 1140px;
        background-image: url('../images/bg-mobile2.png');
        background-repeat: no-repeat;
}

@media (min-width: 1030px) {
    .container {
        background-image: url('../images/bg-desktop.jpg');
        background-position: top;
        background-repeat: no-repeat;
        background-attachment: fixed;
        background-size: cover;
        width: auto;
    }
}       

footer {
height: auto;
height: 100%;
}



/* Patička - definice šířky a výšky */
/*#paticka {width: auto; height: 140px; padding:0px; margin:0px; text-align:right; font-size: 11px; bottom:0px;}*/
#paticka {
    width: auto;
    height: 75px;
    padding: 10px;
    margin: 0px;
    text-align: center;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #597808;
    clip-path: ellipse(51% 130% at 50.1% 130%);
    
}

/*#paticka .footnote {color: #545051; width: auto; height:30px; text-align:right; padding:95px 20px 5px 0px; font-size: 9px;line-height:1;}*/
#paticka .footnote {
    color: #ffffff73;
    width: 100%;
    height: 12px;
    text-align: center;
    font-size: 11px;
    line-height: 1;
    display: flex;
    flex-direction: column;
}
#paticka .footnote p {
    margin-top: 0;
}


/*Mapa*/
#hlavicka .header__map{
    position: absolute;
    right: 0px;
    top: -20px;
    transition: 1.5s
}
#hlavicka .header__map:hover{
    top: 40px;
    top:0;
}

/*Pocasi*/
.header__wrapper{
    display: flex;
    justify-content: center;
}
#header__weather{
    height: 180px;
    position: absolute;
    width: 560px;
    top: 15px;
    clip-path: ellipse(50% 100% at 50.12% 100%);
}

/* Hlavička - definice šířky a výšky */
#hlavicka {
    width: 1120px; 
    height: 250px; 
    font-size: 0px;
    position: relative;
    margin: auto;
    }
/*Search box*/
.search__box{
    width: 83%;
    border-radius: 3px;
    background-color: #d8e6ff;
    border: 1px solid #a6bbe2;
    padding: 5px;
    height: 25px;
}
.search__submit{
background-color: #ffffff;
    border-radius: 3px;
    border-color: rgb(134, 109, 121);
    border: none;
    height: 25px;
    padding: 4px;
    color: #ffffff;
    width:15%;
    /*width: 15%;
    background-color: #7699c4;
    border-radius: 3px;
    box-shadow: none;
    border-color: #649f46;
    color: ededed;*/
}
.search__submit:hover{
    width: 15%;
    background-color:#5471d1; /*Změna hover buttonu*/
    border-radius: 3px;
    box-shadow: none;
    border-color: #5471d1; /*Změna hover buttonu*/
    color: ededed;
    cursor:pointer;
    height:25px;
}
input[type=submit], button, input[type=reset]{
 background: rgb(79, 114, 167, 1);
background: linear-gradient(#9bb4e9 0%, #7e9ecd 49%, #7890c2 100%);
    border-radius: 3px;
    border-color: rgb(252, 186, 3);
    border: none;
    height: 23px;
    padding: 4px;
    color: #ffffff;
    cursor:pointer;
    font-size:14px;
    font-family: Arial;
}
input[type=submit]:hover, button:hover, input[type=reset]:hover {
    background: rgb(79, 114, 167, 1);
    linear-gradient(#9bb4e9 0%, #7e9ecd 49%, #7890c2 100%);
    border-radius: 3px;
    border-color: rgb(252, 186, 3);
    border: none;
    height: 23px;
    padding: 4px;
    color: #f9fcff;
    cursor:pointer;
}
.novinky{
    width:auto;
    border-radius: 2px;
}

/* Blurry bg*/
#obsah, #levy-sloupec, #pravy-sloupec {
    float: unset;
    margin: unset;
}

#telo {
    margin: unset;
}

#telo-bg, #paticka {
    background: unset;
}

.pravy .box-item, .levy .box-item, #paticka, #paticka .footnote {
    padding: unset;
}

#paticka {
    clip-path: unset;
}

#paticka .footnote {
    color: #f5fcff;
}

#telo {
    width: 100%;
}

#telo-bg {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#obsah, #levy-sloupec, #pravy-sloupec {
    background: #edf0ff;
    padding-bottom: 90px
}

#levy-sloupec, #pravy-sloupec {
    width: 195px;
}

#levy-sloupec {
    order: 1;
}

#obsah {
        order: 2;
    width: 680px;
    border-left: 15px solid;
    border-right: 15px solid;
    min-height: calc(100vh - 250px - 30px);
    border-image: linear-gradient(
    to bottom,
    #8399ce,
    #8399ce 
    ) 1 100%;
}

@media (min-width: 1030px) {
    #obsah {
        order: 2;
    width: 680px;
    border-left: 15px solid;
    border-right: 15px solid;
    min-height: calc(100vh - 250px - 30px);
    border-image: linear-gradient(
    to bottom,
    #251f18,
    #576791,
    #ebe0da 
    ) 1 100%;
    }
}     

/*#obsah {
    order: 2;
    width: 680px;
    border-left: 15px solid;
    border-right: 15px solid;
    min-height: calc(100vh - 250px - 30px);
    border-image: linear-gradient(
    to bottom,
    #48cbff,
    #6eae4d 
    ) 1 100%;
}          */

#pravy-sloupec {
    order: 3;
}

#paticka {
    order: 4;
    flex: 0 0 100%;
    margin: -90px;
    height: 75px;
    padding-top: 15px;
}

#paticka .footnote {
    width: 1120px;
    height: 100%;
    background: #8399ce;
    clip-path: ellipse(51% 130% at 50.1% 130%);
}

.pravy, .levy {
    padding: 0 10px;
}
