/* CSS Document */
* {margin:0; padding:0;}
body{background:#FFFFFF; font-family:"Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif;font-size:12px;line-height: 2.0em;color:#222;}
#obal {background:url(images/pozadi.gif) top repeat-x;}
#telo { margin:0 auto; width:910px;}
#hlavicka {height:678px; max-height: 680px;}
#hlavicka .leva {padding:26px 0 0 0;}
#hlavicka .prava {width: 160px;height: 60px;max-height: 60px; margin-top:21px;background:url(images/net.png) no-repeat;}
.freelance{margin-bottom:20px; height:92px;max-height: 92px; width:100%;}
.roundabout-holder  {height:5em;}
.roundabout-moveable-item {cursor:pointer;width:636px;height:478px;margin-top:229px;padding-bottom:20px}
.roundabout-in-focus {cursor:auto;}
#gallery {position:relative;height:520px}
#gallery img {display:block;width:100%;height:100%}
#gallery li {}
.gallery {margin-top:-10px;padding-left:8px;width:100%;overflow:hidden}
.gallery li {float:left;padding-right:10px;padding-top:10px}
.gallery .end {padding-right:0}
.leva { float:left;}
.prava {float:right;}
.clear  { clear:both;height:1px;font-size:1px;border:none;margin-bottom:10px; padding:0;background:transparent;}
h1 { font: normal 2.2em "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #2a4fb9; }
h2 {  font: bold 1.7em "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; margin: 0 0 10px; padding: 0 0 3px; color: #333; border-bottom: 1px solid #eee; }
h3 {  font: bold 1.2em "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; margin: 5px 0 5px; padding: 3px 0 3px 5px; color: #2a4fb9; }
#hlavicka .obrazek {height:605px;max-height: 610px; background:#ffffff; padding:5px 60px 28px 14px; color:#ffffff;}
#obsah { width:100%;}
.pecko { padding:5px;}
.partneri { padding:5px;}
.r-01 {font-size:20px;font-family: "Trebuchet MS",Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#16a13a;}
.h-02 {font-size:14px;font-family: "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#444;}
.h-01 {font-size:18px;font-family:"Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#444;	}
.h-03 {font-size:13px;font-family: "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#444;}
.l-01 {font-size:12px;font-family:"Trebuchet MS",  Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#444;}
.l-02 {font-size:11px;font-family: "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; line-height: 2.0em;color:#444;}
.l-03 {font-size:10px;font-family:"Trebuchet MS",  Tahoma, "Lucida Grande CE", lucida, sans-serif;line-height: 2.0em;color:#444;}
.poptavka {color:#2a4fb9;}
.ctyrisloupce {width:880px;}
.dvasloupce {float: left; width:425px;}
.prvnisloupec {float: left;	width:210px;}
.druhysloupec {float: right;width:210px;}
.dvasloupce2 {float: right; width:425px;}
.prvnisloupec2 {float: left;	width:210px;}
.druhysloupec2 {float: right;width:210px;}
.lezatesloupce {width:880px;}
.lezatesloupce2 {float: left; width:880px;}
.lezatyprvnisloupec {float: left;	width:880px;}
a:hover{text-decoration:none;}
a img { border:0;}
img {vertical-align:top;}
ul { list-style:none;}
strong {font: bold 1.6em "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #222;}
span {font: normal 10px "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #AAA;}
a {color:#3d6f92; font-size:12px;}
em {font: bold 1.0em "Trebuchet MS", Tahoma, "Lucida Grande CE", lucida, sans-serif; color: #2a4fb9;}
/* !!!!!!!!!! navigace !!!!!!!!!!!!! */
#menu ul {float: left;width: 900px;margin-bottom: 20px; list-style-type: none;}
#menu ul li { padding-right: 10px; 
       float: left;
	   width: 90px;
	   position: relative;
   	   background:#fff  url(images/menu.png) no-repeat;
	   font-weight: normal;
	   text-align: center; 
	}
#menu ul li ul li {
	   width: 90px;
	   float: left;
	} 
#menu ul ul {
		width: 90px;
		position: absolute;
		left: 0; top: 2.3em;
		visibility: hidden;
	   font-size: 1.1em; display: inline;;
		border: none; 
	}
#menu ul li:hover ul {
		visibility: visible;
	}
#menu ul li	a {
       display: block;
	   padding: 5px 0 ;   
	    
	   text-decoration: none;
  	   color: #000;
	}
#menu ul li #menu ul li	ul li a {
	   border-right: none; 
	}
#menu ul li a:hover {
	   background:#fff url(images/menu2.png) no-repeat;
	}  	
a.kontakt 
  {width: 130px; 
  height: 40px; 
  display: block; 
  background-image: url(images/nadpis.png);	text-align: center;} 
a.kontakt:hover 
  {background-image: url(images/nadpis.png);} 
a.kontakt span 
  {display: none;}	
a.kontaktdve 
  {width: 140px; 
  height: 47px; 
  display: block; 
  background-image: url(images/kontakt.jpg);	text-align: center;} 
a.kontaktdve:hover 
  {background-image: url(images/kontakt2.jpg);} 
a.kontaktdve span 
  {display: none;}	
a.chcito 
  {width: 130px; 
  height: 40px; 
  display: block; 
  background-image: url(images/chcito.jpg);	text-align: center;} 
a.chcito:hover 
  {background-image: url(images/chcito.jpg);} 
a.chcito span 
  {display: none;}
.duraz { width:100%; margin-bottom: 25px; background:url(images/duraz.gif) bottom repeat-x; }
.podobsah {padding:23px 0 0 17px; color:#2d2d2d;font-size: 12px;}	
.podobsah a {color:#444444; font-weight:bold;}
#paticka {background:#FFFFFF ;clear: both;color: #000000;display: block;padding-top: 20px;text-align: center;}
#kody {background:#FFFFFF ;clear: both;color: #000000;display: block;padding-top: 20px;text-align: center;}
.linie {background:url(images/duraz.gif) top repeat-x;}
.linie .jedna {background:url(images/duraz.gif) bottom repeat-x;}
.linie .dva {background:url(images/duraz.gif) left repeat-y;}
.linie .tri {background:url(images/duraz.gif) right repeat-y;}
.linie .ctyri {background:url(images/ctyri.gif) top left no-repeat;}
.linie .pet {background:url(images/pet.gif) top right no-repeat;}
.linie .sest {background:url(images/sest.gif) bottom left no-repeat;}
.linie .sedm {background:url(images/sedm.gif) bottom right no-repeat; width:100%;}
.linie .osm {padding:4px 4px 15px 2px;}
.linie a img {float:right;}
.devet {padding-bottom:2px; background:url(images/devet.gif) bottom repeat-x;}
.odkaz {clear:both;text-align:right;}
.odkaz a{background:url(images/sipka.png) top right no-repeat; padding-right:18px; color:#000000; font-weight:bold;}
#sloupce #obsah .podobsah {padding:17px 0 19px 0;}
#sloupce #obsah {padding:9px 13px 3px 15px;}
#sloupce #obsah  {padding:9px 13px 3px 15px;}
#sloupce #obsah  {padding:9px 13px 3px 15px;}
#sloupce #obsah .p1 {padding:1px 0 7px 0;}
#spodniobsah {  clear:both;margin-top: 50px;
	background: #fff;
	border-bottom: 1px solid #1A1A1A;
	border-top: 1px solid #2A2A2A;
	color: #222;
	padding: 16px;
}
#spodniobsah  a {
	color: #222; 	text-decoration: none;
}
#spodniobsah a:hover {
	color: #5ca7cf;
	text-decoration: none;
}
#spodniobsah ul li {
	border-bottom: 1px solid #303030;
}
#spodniobsah ul li  {
	color: #222;
	display: block;
	padding: 4px 6px;
}
#spodniobsah ul li  {
	background: #205e97;
	color: #16a13a;
	text-decoration: none;
}
.levy {float: left;}
.pravy {float: right;}
.clear,.clearer {clear: both;}
.clearer,.block {
	display: block;
	line-height: 0;
	font-size: 0;
}
.clearer {height: 0;}

.formular, .kamdal {width: 31%; margin-right: 3%;}
.kontakt, .kamdal {width: 31%; margin-right: 3%;}

.kamdal {margin-right: 0;}

.odstavec {  clear: both;
		background: #fff; }
.slideshow{background: #fff;}

.weboveprezentace .fot .prevPage
{background-image: url(img/levy.png);}
.weboveprezentace .fot .nextPage
{background-image: url(img/pravy.png);}
.weboveprezentace .Ref
{float: left;margin: 0 5px;}
.weboveprezentace .fot .prevPage:hover
.weboveprezentace .fot .nextPage:hover,
{cursor: pointer;
}
.weboveprezentace .fot .tlacitko
{
	float: left;
	width: 40px;
	height: 100px;
}
.weboveprezentace .fot .prevPage,
.weboveprezentace .fot .nextPage
{
	float: left;
	width: 40px;
	height: 40px;
	margin-top: 60px;
}
.weboveprezentace .fot .prevPage
{
	background-image: url(img/levy.png);
}
.weboveprezentace .fot .nextPage
{
	background-image: url(img/pravy.png);
}
.weboveprezentace .fot #slide
{
	width: auto;
	margin: 10px;
	margin-left: 13px;
}
.weboveprezentace .fot .items
{
	margin: 5px 5px;
	height: 200px;

	float: left;
}
.slide 
{
	padding-left: 2px;
}
.slide .odkazy
{
	font-size: 12px;
	text-align: center;
	padding-top: 5px;
}
.items
{
	margin: 5px 5px;
	height: 300px;

	float: left;
}
.Ref
{
	width: 176px;
	height: 270px;
	font-size: 12px;
}
.Ref
{
	float: right;
	padding-right: 6px;
}
.Ref 
{
	float: right;
	padding-right: 6px;
}
.RefUp
{
	height: 124px;
	padding: 3px;
	text-align: center;
}
.Ref
{
	float: left;
	margin: 0 5px;
}
.tlacitko
{
	float: left;
	width: 40px;
	height: 100px;
}




#reference-fotky {
	width:100%;
	padding:25px 0 42px 20px;	
}


.odstup {margin-bottom:35px}

.refe-obsah {width:100%;overflow:hidden}

.fotka-klient, .fotka-klient2, .col-3, .col-4 {float:left}

.odsazeni {margin-bottom:20px}

.img-border {
	float:left;
	padding:5px;
	background:#fff;
	box-shadow: 5px 5px 5px #ccc;
	border-radius:8px;
	margin-top:2px;
	margin-bottom:2px;
}

.button {
	display:inline-block;
	padding:0 24px;
	margin-left:2px;
	margin-bottom:2px;
	font-size:14px;
	line-height:38px;
	color:#000;
	border:1px solid #fff;
	background:url(../images/button-tail.gif) 0 0 repeat-x #f2f2f2;
	box-shadow:0 0 2px #bbb;
	cursor:pointer;
}
.button:hover {background:#2a4fb9;color:#fff}




/* forms */

.lezatesloupce form { 
		float: left;
	    border:1px solid #ccc;
		padding: 10px 10px 20px 10px; 
		margin: 15px 0 20px 0;
		width: 856px;
		
		/* -- CSS3 - define rounded corners for the form -- */	
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px; 		

	}	
	
fieldset { border: none; }
	
	#user-details { 
		float: left;
		width: 350px; 
	}
	
	#user-message { 
		float: right;
		width: 390px;
	}
	
input, textarea { 		
		padding: 8px; 
		margin: 4px 0 20px 10px; 
		background: #fff; 
		width: 250px; 
		font-size: 14px; 
		color: #555; 
		border: 1px #ddd solid;
		
		/* -- CSS3 Shadow - create a shadow around each input element -- */ 
		-webkit-box-shadow: 0px 0px 4px #aaa;
		-moz-box-shadow: 0px 0px 4px #aaa; 
		box-shadow: 0px 0px 4px #aaa;
		
		/* -- CSS3 Transition - define what the transition will be applied to (i.e. the background) -- */		
		-webkit-transition: background 0.3s linear;							
	}
	
textarea {		
		width: 300px; 
		height: 165px; 		 		
	}
	
input:hover, textarea:hover { 
		background: #eee; 
	}
		
input.submit { 	
		width: 320px; 
		color: #fff; 
		text-transform: uppercase; 
		margin: 10px;
		background-color: #18a5cc;
		border: none;
		
		/* -- CSS3 Transition - define which property to animate (i.e. the shadow)  -- */
		-webkit-transition: -webkit-box-shadow 0.3s linear;
		
		/* -- CSS3 - Rounded Corners -- */
		-moz-border-radius: 4px; 
		-webkit-border-radius: 4px;
		border-radius: 4px; 
						
		/* -- CSS3 Shadow - create a shadow around each input element -- */ 
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#18a5cc), to(#0a85a8)); 
		background: -moz-linear-gradient(25% 75% 90deg,#0a85a8, #18a5cc);		
	} 
	
input.submit:hover { 		
		-webkit-box-shadow: 0px 0px 20px #555;
		-moz-box-shadow: 0px 0px 20px #aaa; 
		box-shadow: 0px 0px 20px #555;	
		cursor:  pointer; 
	}