body {

	font-family: Verdana;

	margin: 0;

	cursor: grab;

	background-size: contain;

}

 

.pozadi {

	margin: auto;

	width: 1400px;

	background-image: url(Obr/Page.png);

	background-repeat: no-repeat;

}

 

.obsah {

	margin: auto;

	align-items: center;

	width: 900px;

}

 

.obsah_realizace {

	text-align: center;

	margin: auto;

	align-items: center;

	width: 1250px;

}

 

.zvetseniAnimace {

font-size: 10pt;

color: #858079;

padding: 0px 30px 20px 30px;

transform:scale(1); transition:transform 0.5s linear; 

}

 

.zvetseniAnimace a {

	color: rgb(59, 58, 58);

}

 

.zvetseniAnimace:hover { transform:translate(0%, 0%) scale(1.3); }

 

.zvetseniAnimaceText {

	font-size: 10pt;

	color: #858079;

	padding: 0px 30px 20px 30px;

	transform:scale(1); transition:transform 0.5s linear; }

 

.zvetseniAnimaceText a {

		color: rgb(59, 58, 58);

}

 

.zvetseniAnimaceText:hover { transform:translate(0%, 0%) scale(1.1); }

 

h3 {

	font-size: 13pt;

	font-family:monospace;

	font-weight: bold;

} 

 

h2 {

	font-size: 16pt;

	font-weight: bold;

	color: rgb(59, 58, 58);

}

 

td {

	font-size: large;

	font-family: monospace;

	vertical-align: top;

	padding-left: 10px;

	color: rgb(59, 58, 58);

}

 

.nadpis {

	font-size: xx-large;

	font-family: monospace;

	color: rgb(59, 58, 58);

}

 

a {

	cursor: pointer;

	text-decoration: none;

	color: rgb(59, 58, 58);

}

 

.realizace-obrazek {

	display: inline-block;

	margin: 0 auto;

}

 

.realizace-obrazek div {

	padding-top: 10px;

	color: rgb(59, 58, 58);

}

 

 

p {

	font-size: 8pt;

}

 

.fadein img {

	color: white;

	position: absolute;

	-webkit-animation-name: fade;

	-webkit-animation-iteration-count: infinite;

	-webkit-animation-duration: 25s;

	animation-name: fade;

	animation-iteration-count: infinite;

	animation-duration: 25s;

}

 

@-webkit-keyframes fade {

	0% {

		opacity: 1;

	}

 

	12% {

		opacity: 1;

	}

 

	20% {

		opacity: 0;

	}

 

	90% {

		opacity: 0;

	}

 

	100% {

		opacity: 1;

	}

}

 

@keyframes fade {

	0% {

		opacity: 1;

	}

 

	12% {

		opacity: 1;

	}

 

	20% {

		opacity: 0;

	}

 

	90% {

		opacity: 0;

	}

 

	100% {

		opacity: 1;

	}

}

 

#f5 {

	-webkit-animation-delay: 20s;

}

 

#f4 {

	-webkit-animation-delay: 15s;

}

 

#f3 {

	-webkit-animation-delay: 10s;

}

 

#f2 {

	-webkit-animation-delay: 5s;

}

 

#f1 {

	-webkit-animation-delay: 0;

}

 

.sloupec span {

	font-size: 10pt;

	color: #858079;

	width: 100%;

	margin-top: 8px;

	float: left;

	clear: left;

}

 

.oddelovac {

	border-bottom: 4px solid #8CA4A2;

	height: 10px;

	width: 900px;

	margin: auto;

	clear: both;

}

 

.paticka {

	width: 100%;

	height: 50px;

	clear: both;

}

 

.sekce-cerna {

	width: 900px;

	background-color: #C2CED1;

	color: #929292;

}

 

.sekce-cerna-kontakt {

	width: 900px;

	margin: auto;

}

 

 

.sekce-cerna-radek  {

	width: 100%;

	margin: auto;

}

 

.sekce-cerna-radek:after {

	content: "";

	display: table;

	clear: both;

}

 

.sloupec_animace:hover {

	animation: wiggle 2s linear infinite;

  }

 

  /* Keyframes */

  @keyframes wiggle {

	0%, 7% {

	  transform: rotateZ(0);

	}

	15% {

	  transform: rotateZ(-15deg);

	}

	20% {

	  transform: rotateZ(10deg);

	}

	25% {

	  transform: rotateZ(-10deg);

	}

	30% {

	  transform: rotateZ(6deg);

	}

	35% {

	  transform: rotateZ(-4deg);

	}

	40%, 100% {

	  transform: rotateZ(0);

	}

  }

 

 

 

 

  button {

	position: absolute;

	left: calc(50% - 3em);

	top: calc(50% - 2em);

 

	height: 4em;

	width: 7em;

 

	background: #444;

	background: linear-gradient(top, #555, #333);

	border: none;

	border-top: 3px solid orange;

	border-radius: 0 0 0.2em 0.2em;

	color: #fff;

	font-family: Helvetica, Arial, Sans-serif;

	font-size: 1em;

	transform-origin: 50% 5em;

}

 

.sekce-vyjizdeci-obal {

    height: 160px;

    width: 900px;

    overflow-y: hidden;

    position: relative;

}

 

.sekce-vyjizdeci-obal > div {

    height: 160px;

    width: 900px;

    margin: auto;

	background: url(Obr/papirvysouvaci.png) no-repeat;

    position: absolute;

    top: -320px;

}

 

.sekce-vyjizdeci > div {

	width: 50%;

	float: left;

}

 

.sekce-vyjizdeci-obal > div.sekce-vyjizdeci {

    animation-name: vyjeti;

    animation-duration: 3s;

    animation-fill-mode: forwards;

 

}

 

@keyframes vyjeti {

    0% {

        top: -120px;

    }

    100% {

        top: 0;

    }

}

 

 

.sloupec_animace:hover {

	background-color: #434748;

}

 

.sloupec_animace {

	text-align: center;

	float: left;

	width: 33.33%;

	padding-top: 20px;

}

 

.sloupec {

	text-align: center;

	width: 33.33%;

	padding-top: 20px;

	float: left;

}

 

.hlavicka {

	background: url(Obr/nahled.jpg) no-repeat;

	width: 900px;

	height: 200px;

	margin: auto;

}

 

.hlavicka a {

	margin-right: 15px;

	margin-top: 5px;

	color: #929292;

	font-weight: bold;

}

 

.sekce-bila:after {

	content: "";

	display: table;

	clear: both;

}

 

.sekce-cerna:after {

	content: "";

	display: table;

	clear: both;

}

 

.realizace-popis a {

	color: rgb(59, 58, 58);

}

 

.realizace-popis:hover {

	background-color: #434748;

}

 

.sloupec h2 {

	padding-bottom: 10px;

}

 

.sloupec h3 {

	padding-bottom: 10px;

	margin: 5;

}



.nadpis-main {

	color: white;

	font-weight: bold;

	font-size: 30px;

	font-family:monospace;

	color: rgb(59, 58, 58);

}



.nadpis-jmeno {

	font-weight: bold;

	font-size: 25px;

	margin:auto;

	width: 900px;

	margin: auto;

	padding-bottom: 20px;

	font-family:monospace;

	color: rgb(59, 58, 58);

}



.sekce-vyjizdeci-cast-prvni {

	font-size: xx-large;

}



.sekce-vyjizdeci-cast-druha {

	font-size: xx-large;

}



.sekce-vyjizdeci-cast-1 {

	margin-left: 20px;

	margin-right: 10px;

	text-align: center;

}



.sekce-vyjizdeci-cast-2 {

	margin-left: 10px;

	margin-right: 20px;

	text-align: center;

}



.nadpis-2 {

	background: url(Obr/castpapiru.png) no-repeat;height: 80;

	text-align: center;padding-top: 10;

	font-weight: bold;

	font-size: xx-large;

	font-family: monospace;

}



.flex {

	display: flex;

	justify-content: center;

}



.realizace-table {

	font-family: monospace;

	padding-top: 30px;

	padding-bottom: 40;

	padding-left: 30px;

}

 

.kontakt {

	text-align: left;

	padding-left: 30px;

	padding-top: 20px;

}

 

 

.kontakt span {

	font-size: 12pt;

	color: #929292;

	float: left;

	clear: left;

	margin-top: 8px;

}

 

 

 

 

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

 

	.pozadi {

		background-image: none;

	}



	.top {

		text-align: center;

		width: 100%;

	}



	.hlavicka {

		width: 900px;

	}



	.obsah {

		width: 100%;

	}



	.sloupec {

		width: 100%;

	}



	.nadpis-jmeno {

		font-size: 90px;

		width: 100%;

	}



	.nadpis-main {

		font-size: 70px;

		width: 100%;

	}



	.sekce-vyjizdeci-obal {

		margin: auto;

		height: 1350px;

	}



	.sekce-vyjizdeci-obal div {

		background: url(Obr/papirvysouvaci2.png) no-repeat;

		height: 1350px;

		top: -100px;

	}



	.sekce-vyjizdeci-cast-prvni {

		font-size: 80px;

	}

	

	.sekce-vyjizdeci-cast-druha {

		font-size: 80px;

	}



	.sekce-vyjizdeci-cast-1 {

		font-size: 50px;

	}



	.sekce-vyjizdeci-cast-2 {

		font-size: 50px;

	}



	.nadpis-2 {

		height: 100px;

		width: 1250;

		margin-left: 80px;

		font-size: 70px;

		background: url(Obr/castpapiru2.png) no-repeat;

	}



	.fadein {

		width: 500px;

	}



	.sekce-cerna-radek {

		padding-top: 30px;

		width: 900px;

		padding-bottom: 30px;

	}



	.zvetseniAnimace {

		height: 500px;

	}



	.realizace-obrazek-main {

		height: 350px;

		width: 350px;

	}



	.nadpis-realizace {

		font-size: 70px;

	}



	.realizace-popis {

		font-size: 60px;

	}







	.kontakt span {

		font-size: 50px;

	}



	.kontakt {

		height: 400px;

	}



	.nadpis-kontakt {

		font-size: 70px;

	}



	.flex {

		flex-direction: column;

	}



	.realizace-table {

		font-size: 40px;

                width:900px;

	}



	.nadpis {

		font-size: 60px;

	}



	.realizace-obrazek div {

		font-size: 40px;

		padding-bottom: 50px;

	}



	.realizace-table td {

		font-size: 35px;

	}



	.nadpis-td{

		font-size: 40px;

	}



}