@charset "utf-8";

html { color: #000; background: #FFF; margin: 0px; padding: 0px; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td { margin: 0px; padding: 0px; }
body { font-family: "Titillium Web", sans-serif; font-weight: 300; font-size: 18px; }
a { color: #000000; }
a:hover { color: #000000; }
a img { border: none; }
#page-wrap { width: 100%; margin: 0px auto; }
.clear { clear: both; }

.topmenu { margin: 0px auto; max-width: 1000px; height:140px; background-color: #ffffff;}
.topmenu-left { float: left; padding-top: 25px; }
	@media screen and (max-width: 600px) { .topmenu-left { float: left; padding-top: 10px; } }
.topmenu-left img { width: 300px; height: 56px; }
	@media screen and (max-width: 1000px) { .topmenu-left img { margin-left: 15px; } }
	@media screen and (max-width: 600px) { .topmenu-left img { width: 200px; height: 37px; margin-left: 15px; } }
.topmenu-right { float: right; padding-top: 40px; }
	@media screen and (max-width: 900px) { .topmenu-right { float: right; padding-top: 0px; } }
	@media screen and (max-width: 600px) { .topmenu-right { float: right; padding-top: 0px; } }
.topmenu-right ul { list-style-type: none; margin: 0 auto; position: relative;}
.topmenu-right ul li { float: left; margin-left: 30px; }
	@media screen and (max-width: 1000px) { .topmenu-right ul li { float: left; margin-left: 10px; margin-right: 20px; } }
	@media screen and (max-width: 600px) { .topmenu-right ul li { float: left; margin-left: 10px; } }
.topmenu-right ul li a { text-transform: uppercase; text-decoration: none; font-weight: 700; font-size: 16px; color: #358083; border: 1px solid #ebebeb; padding-left: 15px; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; line-height: 30px; background: #ebebeb; }
	@media screen and (max-width: 900px) { .topmenu-right ul li a { text-transform: uppercase; text-decoration: none; font-weight: 700; font-size: 16px; color: #358083; border: 1px solid #ebebeb; padding-left: 15px; padding-right: 15px; padding-top: 10px; padding-bottom: 10px; line-height: 80px; } }
	@media screen and (max-width: 600px) { .topmenu-right ul li a { text-transform: uppercase; text-decoration: none; font-weight: 700; font-size: 16px; color: #358083; border: 1px solid #ebebeb; padding-left: 15px; padding-right: 15px; padding-top: 5px; padding-bottom: 5px; line-height: 50px; } }
.topmenu-right ul li a:hover { color: #000000; border: 1px solid #868686; text-decoration:none; }
.toppic img { width: 100%; }

.topmenu2 { display: none; position: absolute; top: 0px; width: 100%; }
.topmenu2-obsah { max-width: 1000px; margin: 0px auto; }
.topmenu2 ul { list-style-type: none; margin: 0 auto; position: relative; margin-top: 10px; }
.topmenu2 ul li {float: left; margin-left: 30px; margin-top: 4px; }
	@media screen and (max-width: 600px) { .topmenu2 ul li {float: left; margin-left: 10px; margin-bottom: 4px; } }
.topmenu2 ul li a { text-transform: uppercase; text-decoration: none; font-weight: 700; font-size:16px; color: #358083; border: 1px solid #ebebeb; padding-left: 15px; padding-right: 15px; background: #ebebeb; }
.topmenu2 ul li a:hover { color: #000000; border: 1px solid #868686; text-decoration: none; }
.topmenu2-logo { float: left; }
	@media screen and (max-width: 400px) { .topmenu2-logo { min-width: 300px; } }
.topmenu2-logo img { height: 37px; }
	@media screen and (max-width: 1000px) { .topmenu2-logo img { margin-left: 15px; } }
	@media screen and (max-width: 600px) { .topmenu2-logo img { height: 40px; margin-left: 15px; } }
.fixed { position: fixed; display: block; width: 100%; background-color: #ffffff; z-index: 10000; border-bottom: 1px solid #ebebeb; }

#two { width:100%; margin:0 auto; background: #ffffff; overflow: hidden;padding-bottom: 50px; }
#two .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 50px; max-width: 1000px; }
	@media screen and (max-width: 600px) { #two .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 30px; max-width: 1000px; } }
#two .in h1 { text-decoration: none; font-size: 50px; color: #358083; padding-bottom: 20px; line-height: 50px; }
	@media screen and (max-width: 600px) { #two .in h1 { text-decoration: none; font-size: 40px; color: #358083; padding-bottom: 20px; line-height: 40px; } }
#two .in p { margin-bottom: 15px; }
.item { float: left; width: 225px; margin: 10px; margin-bottom: 0px; }
.item p { padding: 0px; margin: 0px; }
p.nahled { width: 225px; height: 211px; padding: 0px; margin: 0px; }
p.nahled a:hover img { opacity: 0.8; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; }
p.popis { padding: 0px; margin: 0px; }
p.popis a { display: block; font-size: 18px; margin: 0px; padding: 10px; padding-top: 5px; padding-bottom: 5px; color: #ffffff; text-decoration: none; background: #358083; }
p.popis a:hover { background: #000000; color: #ffffff; }

#three { width: 100%; margin:0 auto; background: #ebebeb; overflow: hidden;padding-bottom: 50px; }
#three .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 50px; max-width: 1000px; }
	@media screen and (max-width: 600px) { #three .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 30px; max-width: 1000px; } }
#three .in h2 { text-decoration: none; font-size: 50px; color: #868686; line-height: 50px; }
	@media screen and (max-width: 600px) { #three .in h2 { text-decoration: none; font-size: 40px; color: #868686; line-height: 40px; } }
#three .in p { margin-top: 15px; margin-bottom: 15px; text-align: justify; }
#three .in .webvyrobce { float: right; text-decoration: none; font-weight: 700; font-size: 16px; color: #868686; border: 1px solid #868686; padding: 15px; padding-top: 10px; padding-bottom: 10px; }
#three .in .webvyrobce a { text-transform: uppercase; }
#three .in .webvyrobce a:hover { text-decoration: none; }
#three .in p.video { text-align: center; }
#three .in p.video iframe { width: 100%; max-width: 560px; }
#three .in strong { font-weight: bold; }
#three .in ul li { margin-left: 40px; list-style-type: square; }

#four { width: 100%; margin: 0px auto; background: #358083; overflow: hidden; padding-bottom: 50px; color:#FFFFFF; }
#four .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 50px; max-width: 1000px; }
	@media screen and (max-width: 600px) { #four .in { text-align: left; margin: 0px auto; padding-left: 20px; padding-right: 20px; padding-top: 30px; max-width: 1000px; } }
#four .in h3 { text-decoration: none; font-size: 50px; color: #ffffff; }
	@media screen and (max-width: 600px) { #four .in h3 { text-decoration: none; font-size: 40px; color: #ffffff; } }
#four strong { color: #FFF; font-size: 20px; font-weight: 400; }
#four p { margin-bottom: 0px !important; }
#four .in .left { float: left; width: 35%; }
	@media screen and (max-width: 700px) { #four .in .left { float: left; width: 100%; } }
#four .in .right { float: left; width: 65%; }
	@media screen and (max-width: 700px) { #four .in .right { float: left; width: 100%; padding-top: 40px; } }
#four a { color: #d7d7d7; }
#four a:hover { color: #d7d7d7; text-decoration: none; }

#zapati-odkazy-box { list-style: none !important; margin-top: 20px; }
#zapati-odkazy-box li { float: left; font-size: 80%; }
#zapati-odkazy-box li.prvni { padding-top: 9px; padding-left: 13px; padding-right: 10px; color: #000000; }
#zapati-odkazy-box li a { background: #000000; color: #ffffff; padding: 4px 8px; margin-left: 5px; margin-right: 5px; text-decoration: none; line-height: 40px; }
#zapati-odkazy-box li a:hover { background: #ffffff; color: #000000; }