html,
body {
    scroll-behavior: smooth;
    background-position-x: center !important;
    width: 100%;
    height: 100%;
    padding: 0em;
    margin: 0px;
    font-family: 'Geologica', sans-serif;
    /*  overflow: hidden; */
    overflow-x: hidden;
}

.ind_grad {
    background: linear-gradient(0deg, white 30%, transparent 70%), url(https://wallpaperaccess.com/full/81552.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.dest_grad {
    background: linear-gradient(0deg, white 50%, #00000055 60%, #00000055 70%), url(https://wallpaperaccess.com/full/235606.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.lm_grad {
    background: linear-gradient(0deg, white 50%, #00000055 60%, #00000055 70%), url(https://wallpaperaccess.com/full/35663.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    /* background-size: 100%;
    background-position: 1% -30%; */
}

.kont_grad {
    background-color: #fff;
}

@media only screen and (max-width: 600px) {

    html,
    body {
        padding: 0 0 0 0;
        margin: 0px;
    }

    nav {
        height: 10% !important;
    }

    /* nav tlacitko */
    #mobilnimenu {
        display: inherit !important;
        /* default */
        flex-grow: 0;
    }

    #pcmenu {
        display: none !important;
    }

    #nazevs,
    #nazevs>* {
        justify-content: center;
        text-align: center;
    }

    .str {
        max-width: 100%;
    }

    .str_top {
        max-width: 90%;
        height: 70% !important;
        margin: auto !important;
    }

    .str_mid {
        max-width: 100% !important;
    }

    .destinace_grid>div {
        width: 100% !important;
    }
}

@media only screen and (max-width: 800px) {
    #mobilnimenu {
        display: inherit !important;
        /* default */
        flex-grow: 0;
    }

    #pcmenu {
        display: none !important;
    }

    #nazevs,
    #nazevs>* {
        justify-content: center;
        text-align: center;
    }
    .hlavni_grid {
        grid-template-columns: 1fr !important;
        gap: 2px 2px;
        grid-auto-flow: column !important;
        grid-template-areas:
            "b"
            "s1"
            "s2" !important;
        height: 100% !important;
        margin: 0;
    }

    .alertgridtext {
        font-size: 0.8em !important;
        padding: 10px !important;
    }

    .heading-img > .litac {
        left: 0;
        top: 0;
        padding: 16px !important;
        color: #fefbfc;
        position: absolute;
    }

    .litac > .top {
        font-size: 1.2em !important;
    }
    .litac > .bottom {
        font-size: 1em !important;
    }

    .custom-dest-h {
        height: 50% !important
    }
}

@media only screen and (min-width: 1240px) {
    .destinace_grid>div {
        width: 30% !important;
    }
}

.full {
    height: 100vh;
}

nav {
    top: 0;
    position: absolute;
    width: 100%;
    height: 7.5%;
    /*7.5vh*/
    background: linear-gradient(180deg, #000000ab 0%, rgb(255 255 255 / 0%) 100%);
}
nav * {
    z-index: 1;
}

footer {
    width: 100%;
    background: #ededed;
    position: static;
}

footer>span {
    width: 100%;
    padding-top: 2em;
    padding-bottom: 2em;
    text-align: center;
    display: block;
}

footer>ul>li {
    list-style-type: disc;
}

footer>ul>li>a {
    color: #32a5fd;
    text-decoration: none;
}

footer>ul>li::before {
    content: ''
}

.row {
    height: 100%;
    display: flex;
    /* flex-direction: row;
    justify-content: center;*/
    /* align-items: center;*/
}

.row>.col {
    color: white;
    align-self: center;
}

/* nalevo napravo row */
.row-l {
    flex-grow: 1;
    justify-content: flex-start;
}

.row-r {
    /* margin-left: auto;*/
    display: flex;
    align-self: initial !important;
    flex-shrink: 3;
    justify-content: flex-end;
}

/* preset paddingu */
.pl-2 {
    padding-left: 2em;
}

.pr-2 {
    padding-right: 2em;
}

.vw-5 {
    padding-right: 5vw !important;
}

.p-1 {
    padding: 1em;
}
.p-2 {
    padding: 2em;
}
.p-3 {
    padding: 3em;
}
.p-4 {
    padding: 4em;
}
.p-6 {
    padding: 6em;
}

/* nav tlacitko */
#pcmenu {
    display: inherit;
}

#mobilnimenu {
    display: none;
    font-size: 1.8em;
    color: white;
    font-weight: 300;
}

#mobilnimenu>a>span {
    transform: scaleX(1.5);
}

/* */
.hid {
    display: none !important;
}

.nodec,
.nodec>* {
    text-decoration: none;
    color: currentColor;
}

/* tlacika cudliky */
.button {
    border-radius: 0.8em;
    padding: 8.5px;
    padding-right: 1em;
    padding-left: 1em;
}

.button-zeleny {
    border-radius: 0.8em;
    background: #5e44ee;
    padding: 8.5px;
    font-weight: 300;
}

.button-blue {
    border-radius: 0.5em;
    color: white;
    margin-top: 1em;
    /* background: #44aaee; */
    background: #0090ff;
    font-size: 1em;
    padding-left: 1em;
    padding-right: 1em;
}

.button-dark-blue {
    border-radius: 0.5em;
    color: white;
    margin-top: 1em;
    background: #142c85;
    font-size: 1em;
    padding-left: 2em;
    padding-right: 2em;
}

/* menu */
.mobilnimenu {
    margin: auto;
    top: 1em;
    left: 0;
    right: 0;
    text-align: center;
    position: absolute;
    height: 50%;
    z-index: 2;
    width: 90%;
    background: rgb(255, 255, 255);
    border-radius: 0.5em;
    display: flex;
    flex-direction: column;
}

.fade {
    width: 100vw;
    z-index: 1;
    background: #0009;
    height: 100vh;
    position: absolute;
}

.zavrit_cudlik {
    color: #000000a6;
    margin-right: 0.2em;
    font-size: 1.5em;
    float: right;
    border: 1px solid #000000a6;
    border-radius: 10px;
    /* aspect-ratio: 1; Neee */
    width: 10%;
    padding-left: 1px;
    padding-top: 1px;
    margin-top: 0.2Em;
}

.zavrit_cudlik>span {
    line-height: 1.5em;
}

.mheader {
    height: 15%;
}

.ost {
    display: flex;
    height: 90%;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}

.ost>div {
    width: 100%;
    height: 10%;
    border-bottom: 1px #00000030 solid;
    display: flex;
    align-items: center;
}

.ost>div:last-child {
    border-bottom: 0px #fff solid;
}

.ost>div>a {
    margin-left: 1em;
    font-size: 1.25em;
    float: left;
}

.ost>div>span {
    margin-left: auto;
    font-weight: 800;
    margin-right: 1em;
    float: right;
    color: #44aaee;
}



/* oric nas */
ol {
    list-style-type: none;
    padding-left: 0;
    text-align: center;
}

li:before {
    content: '\2713';
    color: #2857e6;
}
li {
    font-size: 1.2em;
}


/*fsdaffsdfasdfasgfsdbxcv
.str {
     height: 100%;

}*/

.str_top {
    flex-direction: column;
    margin: 0;
    align-items: center;
    justify-content: center;
    display: flex;
    width: 100%;
    height: 25em;
}

.heading {
    font-size: 3em;
    color: white;
    align-self: center;
    text-align: center;
}

.subheading {
    font-size: 1.25em;
    color: #ffffffbd;
    align-self: center;
    text-align: center;
}

.str_mid {
    max-width: 90%;
    background: white;
    border-radius: 0.5em;
    /* margin-top: 35vh !important; */
    margin: auto;
    /* box-shadow: rgba(0,0,0,0.8) 0 0 10px; */
}

.no-brd {
    border-radius: 0px;
}

.maly-shadow {
    /* dole */
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px 9px;
}

.div-center {
    margin: auto;
}

.def-card {
    padding: 1em;
    border-radius: 0.5em;
    max-width: 85%;
}

.kontakt-karta {
    padding: 1em;
    border-radius: 0.5em;
    max-width: 85%;
}



.input_form {
background-color: #1d202a;
padding: 2em;
border-radius: 1em;
display: flex;
gap: 0.5em;
justify-content: center;
align-content: center;
flex-wrap: wrap;
flex-direction: row;
align-items: center;
}

.input_form > label {
    color: #efefef
}

.input_form > input, select, option {
    padding: 0.5em;
    border-radius: 0.5em;
    border: #8a8a8a 2px solid;
}

.lm_tabulka {
    overflow-wrap: anywhere;
}

.lm_tabulka > table {
    width:100%;
    z-index:1;
    border-radius: 0.5em;
    color: #000;
}

.lm_tabulka > table > thead {
    color: #37b1e1;
}

td, th {
    padding: 3px;
    border: #37b1e1 0px solid;
}

td {
    text-align: center;
}

.frrrrrrr {
    float: right;
}


.lm_tabulka > table > tbody {
    width:100%; z-index:1;
}


/* efekty */
.hover-eff {
    transition: all 0.2s ease-in-out;
}

.hover-eff:hover {
    transition: all 0.2s ease-in-out;
    /* font-size: calc(1em + 0.05em); */
    transform-origin: center center;
    transform: scale(1.05, 1.05)
}

.fade-eff {
    transition: all 0.2s ease !important;
    background-size: 100% !important;
}

.fade-eff:hover {
    transition: all 0.2s ease !important;
    filter: brightness(0.9) !important;
    background-size: calc(100% + 50px) !important;
}

.normalnifade-eff {
    transition: all 0.2s ease !important;
    box-shadow: inherit;
}

.normalnifade-eff:hover {
    transition: all 0.2s ease !important;
    filter: brightness(0.9) !important;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}



/*==========================*/




.hlavni_grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    /* grid-template-rows: 1fr 1fr 1fr; */
    gap: 1em 1em;
    grid-auto-flow: row;
    grid-template-areas:
        "b b s1"
        "b b s2";
    height: 40%;
    margin: 0;
}

.hlavni_grid * {
    border-radius: 0.5em;
    position: relative;
    cursor: pointer;
    background-repeat: no-repeat !important;
    background-size: 100%;
}

@media only screen and (max-width: 1200px) {
    .hlavni_grid * { /* vypnuti hover effectu */
        background-size: cover !important;
    }
    .fade-eff:hover {
        background-size: cover !important;
    }
}
/*==========================*/

.grid-b {
    grid-area: b;
}

.grid-s1 {
    grid-area: s1;
}

.grid-s2 {
    grid-area: s2;
}

.gridtext {
    left: 5px;
    bottom: 0;
    padding: 16px;
    color: white;
    position: absolute;
}

.alertgridtext {
    left: 1em;
    top: 1em;
    padding: 12px;
    color: black;
    background: orange;
    border-radius: 0.75em;
    position: absolute;
}

.agt-sm {
    left: 0.5em;
    top: 0.5em;
    padding: 10px;
    font-size: 0.8em;
}


.heading-img {
    height: 25em;
    border-radius: 0.75em;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.heading-img > .litac {
    left: 0;
    top: 0;
    padding: 16px;
    color: #fefbfc;
    position: absolute;
}

.litac > .top {
    font-size: 3em;
}
.litac > .bottom {
    margin-bottom: 1em;
    font-size: 1.5em;
}

.heading-img > .litac-circ {
    right: 1em;
    bottom: 1em;
    background: #d50000;
    padding: 7px;
    aspect-ratio: 1;
    line-height: 8em;
    border-radius: 10em;
    font-weight: 600;
    transform: rotateZ(15deg);
    color: #fefbfc;
    position: absolute;
    margin: auto;
}



.vitejte {
    height: 100%;
    padding: 1em;
}

.destinace_grid {
    display: flex;
    flex-direction: row;
    justify-content: center;
    /* padding: 2em; */
    align-content: flex-start;
    flex-wrap: wrap;
    gap: 1em;
}

.dest-barva {
    color: #2958e6;
}

.dest-barva2 {
    color: #43599b;
    margin-top: -1em;
    font-size: 0.9em;
}

/* hůavni stranka grid*/

.grid-2x {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
    grid-gap: 1em 1em;
    grid-auto-flow: row dense;
}

.grid-block {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 0.25em;
    padding: 2em;
}

.grid-block-lg {
    background: rgba(255, 0, 0, 0.25);
    grid-column: auto / span 2;
    grid-row: auto / span 2;
    height: 200px;
}


.destinace_grid {
    width: 100%;
    height: 100%;
}

.destinace_grid>div {
    width: 40%;
    height: 30%;
    border-radius: 0.5em;
    position: relative;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: cover;
}

.destinace_grid>div>.d_cont {
    left: 0;
    bottom: 0;
    padding: 16px;
    color: white;
    position: absolute;
}

.destinace_grid>div>.d_tip {
    right: 0;
    top: 0;
    padding: 8px;
    color: black;
    background: orange;
    position: absolute;
    border-radius: 0.25em;
}

.ct {
    text-align: center;
}
.cl {
    text-align: left;
}
.cr {
    text-align: right;
}

.heading-blue {
    color: #3b5fe2;
}

.heading-dark-blue {
    color: #142c85;
}

/*imgs*/
.img1 {
    /* tunis */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://media.istockphoto.com/id/1190994138/photo/ribat-in-monastir-tunisia.jpg?s=612x612&w=0&k=20&c=tZMpVMBejvgSfSp0Vf8faajIdfZWIwhjhxEfm4J2qso=);
    background-position: center;
}

.img2 {
    /* bg */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://dcontent.inviacdn.net/shared/img/web-830/2017/6/26/m0/406374.jpg);
    background-position: center;
}

.img3 {
    /* hr */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://w0.peakpx.com/wallpaper/906/215/HD-wallpaper-dubrovnik-summer-coast-resort-croatian-city-adriatic-sea-croatia.jpg);
    background-position: center;
}

.img4 {
    /* sp */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://e1.pxfuel.com/desktop-wallpaper/881/373/desktop-wallpaper-spain-sevilla.jpg);
    background-position: center;
}

.img5 {
    /* re */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://c4.wallpaperflare.com/wallpaper/889/754/414/greece-santorini-wallpaper-preview.jpg);
    background-position: center;
}

.img6 {
    /* eg */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://c4.wallpaperflare.com/wallpaper/529/70/359/sphynx-pyramid-egypt-old-building-wallpaper-preview.jpg);
    background-position: center;
}

.img7 {
    /* it */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://c4.wallpaperflare.com/wallpaper/377/82/449/5bf55b183fa85-wallpaper-preview.jpg);
    background-position: center;
}

.img9 {
    /* kub */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://assets.bwbx.io/images/users/iqjWHBFdfxIU/i0hWlC.h0PaQ/v1/1200x-1.jpg);
    background-position: center;
}

.img10 {
    /* thajsko */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://sacavoyage.fr/wp-content/uploads/THAILANDE-ILE-2-900x517.jpg);
    background-position: center;
}

.img8 {
    /* poznavac */
    background: linear-gradient(180deg, #fff0 60%, #000000bf 90%), url(https://www.redok.cz/userfiles/zajezdy/middle/102933.jpg);
    background-position: center;
}

.img20 {
    /* Jordansko */
    background: linear-gradient(333deg, #fff0 60%, #000000bf 90%), url(https://www.tourist-destinations.com/wp-content/uploads/2012/06/wp2208073.jpg);
    background-position: center;
}

.img_empty {
    /* nic */
    background: linear-gradient(180deg, #4878a1c4 60%, #000000bf 90%), url(https://i.pinimg.com/736x/00/9e/59/009e59b9df936efc79f2089d55181766--ocean-wallpaper-summer-wallpaper.jpg);
    background-position: center;
}

/**/

.img-text {
    /* position: relative; */
    height: 100%;
    width: 100%;
}


.img-text>.img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/*.img-text>.img>* {
     position: absolute;
}*/

.img-text>.img>img {
    width: 100%;
}

.img-text>.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* overridy */
.force-cover {
    background-size: cover !important;
}

.destinace_grid.novylayout  {
    height: inherit;
}

.destinace_grid.novylayout > div {
    width: 25em;
    height: 15em;
}

@media only screen and (max-width: 800px) {
    .full-width {
        max-width: 100%;
        padding: 0em;
    }
    .fluidimg {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
}

.fluidimg {
    margin-left: auto;
    margin-right: auto;
    width: 70%;
    display: block;
    border-radius: 0.8em;
    margin-bottom: 1em;
}

#dropdown-div {
    gap: 0.2em;
    max-width: 95%;
    display: flex;
    flex-direction: column;
    height: fit-content;
    font-size: 0.9em
}

#dropdown-div > div {
    width: 100%;
}

#dropdown-div > div:last-child {
    border-bottom: 0px #fff solid;
}

#dropdown-div > div>a {
    margin-left: 0.25em;
    font-size: 1.25em;
    float: left;
}

#dropdown-div > div>span {
    margin-right: auto;
    font-weight: 800;
    margin-left: 1em;
    float: left;
    color: #44aaee;
}
