* {
	box-sizing: border-box;
}
body {
	background: #111;
	min-height: 100vh;
	padding: 0;
	margin: 0;
  font-family: Inter, sans-serif;
/*   overflow-x: hidden; */
}
.gallery {
	position: absolute;
	width: 80%;
  left: 10%;
	height: 100vh;
	overflow: hidden;
}

.cards {
	position: absolute;
	width: 100%;
 
	/*height: 18rem;*/
	top: 20%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cards li {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 100%;
	text-align: center;
    min-height:19.4vw;
	/*line-height: 40rem;*/
	font-size: 2rem;
	font-family: sans-serif;
	background-color: #111; /*#9d7cce;*/
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 0.8rem;


    /*background:white;*/
    /*min-height:500px;*/
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.actions {
	position: fixed;
	bottom: 25px;
	/*left: 50%;
	transform: translateX(-50%);
  */
  width: 100%;
  display: flex;
  justify-content: space-between;
  display:none
}


button {
  display:inline-block;
  outline: none;
  border: none;
  padding: 8px 14px;
  background: #414141;
  background-image: -webkit-linear-gradient(top, #575757, #414141);
  background-image: -moz-linear-gradient(top, #575757, #414141);
  background-image: -ms-linear-gradient(top, #575757, #414141);
  background-image: -o-linear-gradient(top, #575757, #414141);
  background-image: linear-gradient(to bottom, #575757, #414141);
  text-shadow: 0px 1px 0px #414141;
  -webkit-box-shadow: 0px 1px 0px 414141;
  -moz-box-shadow: 0px 1px 0px 414141;
  box-shadow: 0px 1px 0px 414141;
  color: #ffffff;
  text-decoration: none;
  margin: 0 10px;
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  padding: 12px 25px;
  font-family:  sans-serif;
  text-transform: uppercase;
  font-weight: 600;
  cursor: pointer;
  font-size: 13px;
  line-height: 18px;
}

button:hover {
  background: #57a818;
  background-image: -webkit-linear-gradient(top, #57a818, #4d9916);
  background-image: -moz-linear-gradient(top, #57a818, #4d9916);
  background-image: -ms-linear-gradient(top, #57a818, #4d9916);
  background-image: -o-linear-gradient(top, #57a818, #4d9916);
  background-image: linear-gradient(to bottom, #57a818, #4d9916);
  text-shadow: 0px 1px 0px #32610e;
  -webkit-box-shadow: 0px 1px 0px fefefe;
  -moz-box-shadow: 0px 1px 0px fefefe;
  box-shadow: 0px 1px 0px fefefe;
  color: #ffffff;
  text-decoration: none;
}

button {
  font-size: 20px;
  font-weight: 400;
}

a {
  color: #88ce02;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
.drag-proxy {
  visibility: hidden;
  position: absolute;
}


@keyframes skew-x-shake{
  0% { transform: skewX(-15deg); }
  0.2% { transform: skewX(15deg); }
  0.4% { transform: skewX(-15deg); }
  0.6% { transform: skewX(15deg); }
  0.8% { transform: skewX(0deg); }
  100% { transform: skewX(0deg); }
 }

#datarun {
    /*background: url(https://asset.datarun.cz/logo_4k_gvrkid_c_scale,w_3840.png) white;*/
    background: url(https://asset.datarun.cz/datarun_sirka.svg);
    /*animation: skew-x-shake 10s infinite;*/
}
#kontakt {
  background: url(https://asset.datarun.cz/LP_bannery_kontakty.jpg) black;
  color: white;
  display:flex;
  justify-content: flex-end;
  gap: 1em;
  align-items: center;
}

#kontakt div {
  padding:0em 2em;
  border-left: 2px solid white;
  width: 25%;
  text-align:left;
  line-height: 1.4em;
  height:3em;
  align-items: center;
  align-content: center;
  display:grid;
  font-size: 1.3vw;
}

#kontakt div.b0 {
  border:none
}

#kontakt div p {display:inline-block}


#mp-vp {
    background:url(https://mp-vp.cz/baner_4k_er2cns_c_scale,w_3840.jpg);
}

#civilizacni-forum {
    background: url(https://civilizacni-forum.cz/LP_civilizacni_forum_f9xgso_c_scale,w_3840.jpg);
}

#evropske-pereje {
    background: url(https://evropske-pereje.cz/Evropske_pereje_LP_sarfva_c_scale,w_3840.jpg);
}

#amerika-ve-varu {
    background: url(https://amerika-ve-varu.cz/Amerikavevaru_LP_ppbrko_c_scale,w_3840.jpg);
}

#padouch-nebo-hrdina {
    background: url(https://padouch-nebo-hrdina.cz/Padouch_NSL_banner_4k_yxpkri_c_scale,w_3840.jpg);
}

#nezname-slovensko {
    background: url(https://nezname-slovensko.cz/Slovensko_LP_mrsnkw_c_scale,w_2100.jpg);
}

#sni-dane {
    background: url(https://asset.datarun.cz/Snidane_LP_zsvpx7_c_scale,w_2583.jpg);
}

#vsechno-ma-cenu {
  background: url(https://vsechno-ma-cenu.cz/LP_vsechnomacenu_jv0mfa_c_scale,w_2752.jpg);
}

#vysoke-napeti {
  background: url(https://vysoke-napeti.cz/LP_vysoke_napeti_xpkkww_c_scale,w_3566.jpg);
}

#novy-svet {
  background: url(https://novy-svet-podcast.cz/LP_Novy_svet_yjfss9_c_scale,w_3819.jpg);
}

#studie-datarun {
  background: url(https://studie.datarun.cz/cover_studie_web2.jpg);
}



/* teh mobul vreson */

@media (max-device-width: 760px) {

.gallery {width:100%;left:0}

.cards li {
  min-height: 80vw;
}

#datarun {
  background:url(https://asset.datarun.cz/datarun_svyska.svg);
}

#kontakt {
  background:url(https://asset.datarun.cz/LP_bannery_kontakty_square.jpg);
}


  #mp-vp {
    background:url(https://asset.datarun.cz/MPVP_square.jpg);
}

#civilizacni-forum {
    background: url(https://asset.datarun.cz/Civilazacni_forum_square.jpg);
}

#evropske-pereje {
    background: url(https://asset.datarun.cz/Evropske_pereje_square.jpg);
}

#amerika-ve-varu {
    background: url(https://asset.datarun.cz/Amerikavevaru_square.jpg);
}

#padouch-nebo-hrdina {
    background: url(https://asset.datarun.cz/Padouchnebohrdina.jpg);
}

#nezname-slovensko {
    background: url(https://asset.datarun.cz/Slovensko_square.jpg);
}

#sni-dane {
    background: url(https://asset.datarun.cz/Snidane_ctverec.jpg);
}

#vsechno-ma-cenu {
  background: url(https://asset.datarun.cz/Vsechnomacenu_square.jpg);
}

#vysoke-napeti {
  background: url(https://asset.datarun.cz/Vysoke_napeti_square.jpg);
}

#novy-svet {
  background: url(https://asset.datarun.cz/NS_square.jpg);
}

#studie-datarun {
  background: url(https://asset.datarun.cz/studie_square.jpg);
}


#kontakt {
  flex-direction: column;
  gap:2em;
}

#kontakt div {
  width:100%;
  text-align: center;
  border-left: none;
  padding: 1em 0em;
  font-size: 3.5vw;
}

.bt::before {
  content: " ";
  border-bottom: 2px solid white;
  width: 15%;
  margin: 0 auto;
}
div.empty {display:none;}

}