/*	---------------------------------------------------------------------------------------
	Whitwa portfolio
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	Description:	Reset, basic styles and layout
	Media:				screen, projection
	Datum:				25. 8. 2008
	Author:				Zdenek Kostal (http://zdenekkostal.cz/)
	---------------------------------------------------------------------------------------*/

/*	---------------------------------------------------------------------------------------
	Reset & default styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/

html, body, div, span, h1, h2, h3, h4, h5, h6, ol, ul, li, dl, dt, dd, caption, table, tr, th, td, thead, tbody, tfoot, p, blockquote, cite, q, abbr, acronym, address, a, em, strong, img, ins, del, dfn, kbd, pre, xmp, code, form, fieldset, legend, label, object { margin: 0; padding: 0; }
:focus { outline: 0; }

html, body { min-height: 100%; }
html { background: #b1d9d9 url('../images/html.jpg') 50% 0 no-repeat; }
body { margin: 12px 0; font: 87.5%/1.6 sans-serif; color: #000; background: url('../images/body.gif') 50% 0 repeat-y; }
hr { display: none; }

a { color: #0088c8; }
a:hover, a:focus, a:active { text-decoration: none; color: #0088c8; }
img { vertical-align: middle; }
a img, fieldset { border: none; }
textarea { font-family: sans-serif; }
ul li { display: block; list-style: none; }

table { width: 100%; border-collapse: collapse; }
td, th { padding: .3em 1em; }
abbr, acronym { border-bottom: 1px dotted #000; cursor: help; }
address { font-style: italic; }

h1 { font-size: 200%; }
h2 { font-size: 150%; }
h3 { font-size: 120%; }
h4 { font-size: 100%; }
h5 { font-size: 89%; }
h6 { font-size: 60%; }

/*	---------------------------------------------------------------------------------------
	Default classes
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/

.l { float: left !important; }
.r { float: right !important; }
.c { clear: both !important; }
.n { display: none; }

img.l, img.r, img.w { margin: 20px 0; }

.t-l { text-align: left !important; }
.t-c { text-align: center !important; }
.t-r { text-align: right !important; }

.cl, #main { min-height: 1px; }
.cl:after, #main:after { clear: both; visibility: hidden; display: block; height: 0; font-size: 0; content: '.'; }
.ac { position: absolute; left: -9999px; top: 0; z-index: -1; }

.ir, .ir a { position: relative; overflow: hidden; display: block; }
.ir a, .ir span { width: 100%; height: 100%; }
.ir span { position: absolute; left: 0; top: 0; background-position: 0 0; background-repeat: no-repeat; }
.ir a span, a.ir span { cursor: pointer; }

.col { overflow: hidden; float: left; width: 50%; }
.pos { position: absolute; left: 0; top: 0; }

/*	---------------------------------------------------------------------------------------
	Layout
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/

/* Main ---------------------------------------------------------------------------------*/

#main { width: 100%; }
#header, .maincontent, .slogan-in, #menu, #footer { overflow: hidden; width: 896px; margin: 0 auto; padding: 0 40px; }

/* Header -------------------------------------------------------------------------------*/

#header { position: relative; height: auto !important; height: 181px; min-height: 181px; padding-top: 44px; background: url('../images/header.jpg') 0 0 no-repeat; }

#header h1 { font-size: 150%; }
#header h1 a { color: #254f5c; }
#header h1 a:hover, #header h1 a:focus, #header h1 a:active { color: #0088c8; }

#header ul { position: absolute; right: 31px; top: 13px; }

/* Menu ---------------------------------------------------------------------------------*/

ul#menu { right: 32px; top: 107px; float: right; width: auto; padding: 0; } 
#menu li, #header li { float: left; display: inline; margin-right: 9px; letter-spacing: -1px; font-size: 124%; }
#menu a { display: inline-block; z-index:5;}
#menu a, #header li a, #header li em { height: 19px; line-height: 19px; text-decoration: none; font-style: normal; color: #294852; }
#menu a, #header li a, #header li em { padding-right: 12px; background: url('../images/menu-a.gif') 100% 65% no-repeat; }
#menu li.last a, #header .last a, #header li.last em { padding: 0;  background: #FFF; }
#menu a:hover, #menu a:focus, #menu a:active, #menu a.active, #header li a:hover, #header li a:focus, #header li a:active, #header li em { color: #0088c8; }
#menu a.active { text-decoration: none; }

/* Slogan -------------------------------------------------------------------------------*/

.slogan { background: url('../images/slogan.png') 50% 100% repeat-y; }
.slogan-in { position: relative; width: 924px; padding: 0 40px 12px 12px; line-height: 64px; color: #fff; background: #55a86c url('../images/slogan.png') 50% 100% repeat-y; }
.slogan h2 { float: left; height: 59px; padding-left: 25px; font-size: 250%; font-weight: normal; }

.slogan .pixelperfect { width: 555px; }
.slogan .pixelperfect span { width: 580px; background-image: url('../images/slogan-pixelperfect.png'); }
.slogan .kdojsem { width: 915px; height: 123px; }
.slogan .kdojsem span { width: 940px; background-image: url('../images/slogan-kdojsem.png'); }
.slogan .kontakt { width: 915px; }
.slogan .kontakt span { width: 940px; background-image: url('../images/slogan-kontakt.png'); }
.slogan .cojsemudelal { width: 689px; }
.slogan .cojsemudelal span { width: 965px; background-image: url('../images/slogan-cojsemudelal.png'); }
.slogan .sluzby { width: 689px; }
.slogan .sluzby span { width: 965px; background-image: url('../images/slogan-sluzby.png'); }
.slogan .publikuji { width: 915px; }
.slogan .publikuji span { width: 940px; background-image: url('../images/slogan-publikuji.png'); }
.slogan .klient { width: 613px; }
.slogan .klient span { width: 638px; background-image: url('../images/slogan-klient.png'); }
.slogan .error { width: 915px; }
.slogan .error span { width: 940px; background-image: url('../images/slogan-404.png'); }

.slogan .more, .button { float: right; display: inline; width: 148px; height: 38px; margin: 12px 59px 0 0; line-height: 38px; text-align: center; text-transform: uppercase; font-size: 75%; color: #588b07; background: #e6f1d4; }
.slogan .more a { visibility: visible; text-decoration: none; color: #588b07; }
.slogan .more a:hover, .slogan .more a:focus, .slogan .more a:active { color: #77ab26; background-color: #fcfdfa; }
.slogan .more a:hover, .slogan .more a:hover span { background-position: -148px 0; }

.b-prohlednete span { background-image: url('../images/b-prohlednete.png'); }
.b-prehledsluzeb span { background-image: url('../images/b-prehledsluzeb.png'); }
.b-kontaktujteme span { background-image: url('../images/b-kontaktujteme.png'); }
.b-zpetnaportfolio { width: 148px; }
.slogan .b-zpetnaportfolio a:hover, .slogan .b-zpetnaportfolio a:hover span { background-position: -148px 0; }
.b-zpetnaportfolio span { background-image: url('../images/b-zpetnaportfolio.png'); }
.b-dalsiprojekt span { background-image: url('../images/b-dalsiprojekt.png'); }

.button { width: 145px; margin: -51px 61px 5px 0; text-decoration: none; color: #fff; background: #0d0d0d; }
.button:hover { color: #fff; background: #333; }
.button:hover span { background-position: -145px 0; }

/* Maincontent --------------------------------------------------------------------------*/

.maincontent { margin-top: -19px; background: #fff; }
.maincontent h3 { margin: 23px 0 15px; text-transform: uppercase; letter-spacing: -1px; font-size: 152%; color: #30383b; }
.maincontent p { margin-bottom: 7px; }
.maincontent strong { color: #659b10; }

.index .maincontent { margin: 0 auto; padding: 9px 40px 27px; }

/* Content ------------------------------------------------------------------------------*/

#slideshow { position: relative; float: left; display: inline; width: 599px; height: 488px; margin: 4px 0 0 -32px; padding: 58px 0 26px 32px; background: url('../images/slideshow.png') 0 0 no-repeat; }
#slideshow a { position: absolute; left: 0; top: 0; margin: 57px 0 0 32px; width: 599px; height: 488px; }
#slideshow .first { z-index: 90; }

/* Column -------------------------------------------------------------------------------*/

.column { float: right; width: 267px; }
.column dt, .column dd { padding-top: 7px; }
.column dt { clear: left; float: left; font-weight: bold; color: #659b10; }
.column dd { margin-left: 75px; }

/* Footer -------------------------------------------------------------------------------*/

#footer { clear: both; width: 896px; padding: 40px 0 34px; font-size: 90%; color: #2c9898; background: #fff; }
.index #footer { border-top: 1px solid #ccc; }
#footer a { color: #2c9898; }
#footer a:hover, #footer a:focus, #footer a:active { text-decoration: underline; color: #0088c8; }
#footer .ir { height: 18px; margin-bottom: 8px; line-height: 18px; }

#footer ul { float: right; margin: 0; }
#footer li { float: left; }

#footer .copy { float: left; display: inline; width: 361px; margin-left: 349px; }
#footer .copy span { background-image: url('../images/footer-copy.png'); }

#footer .ugd { float: left; width: 186px; }
#footer .ugd span { background-image: url('../images/footer-ugd.png'); }
#footer .ugd a:hover span, #footer .ugd a:focus span, #footer .ugd a:active span { background-position: -186px 0; }

#footer .mail { float: left; width: 137px; }
#footer .mail span { background-image: url('../images/footer-mail.png'); }
#footer .mail a:hover span, #footer .mail a:focus span, #footer .mail a:active span { background-position: -137px 0; }

#footer .phone { width: 121px; }
#footer .phone span { background-image: url('../images/footer-phone.png'); }

#footer .linkedln { width: 72px; }
#footer .linkedln span { background-image: url('../images/footer-linkedln.png'); }
#footer .linkedln a:hover span, #footer .linkedln a:focus span, #footer .linkedln a:active span { background-position: -72px 0; }

#footer .navolnenoze { width: 107px; }
#footer .navolnenoze span { background-image: url('../images/footer-navolnenoze.png'); }
#footer .navolnenoze a:hover span, #footer .navolnenoze a:focus span, #footer .navolnenoze a:active span { background-position: -107px 0; }

#footer .weblog { width: 54px; }
#footer .weblog span { background-image: url('../images/footer-weblog.png'); }
#footer .weblog a:hover span, #footer .weblog a:focus span, #footer .weblog a:active span { background-position: -54px 0; }

/*	---------------------------------------------------------------------------------------
	SUBPAGES
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -*/

#sub .maincontent { padding-top: 0px; }
/*#sub .maincontent ul li { padding-left: 15px; background: url('../images/li.gif') 0 .8em no-repeat; }*/

#sub h3, #sub dd { margin-left: 240px; }
#sub h3 { margin: 52px 0 24px 240px; }
.sIFR-replaced { height: 30px !important; }
#sub dl, #sub .box { overflow: hidden; width: 100%; padding: 15px 0; border: 1px solid #ccc; border-width: 1px 0; }
#sub dt, #sub dd { width: 240px; padding: 6px 0; }
#sub dt { float: left; font-weight: bold; color: #0088c8; }
#sub dd { width: 650px; }
#sub dd p { margin-bottom: 0; }
#sub .box dl { clear: both; padding: 0; border: 0; }

.testimonial { width: 100%; margin-top: 60px; }
.detail .testimonial { display: table; }
.testimonials, .detail .testimonial { border-bottom: 1px solid #ccc; }
.testimonial .description { padding: 0; cursor: default; }
.testimonial .wrapper { overflow: auto; width: 100%; height: 305px; padding-bottom: 15px; }
#sub .testimonial .description h3 { margin-top: -2px; margin-bottom: 22px; line-height: 1.2; }
#sub .testimonial dl { padding-bottom: 10px; border-bottom: none; line-height: 1.5; }
#sub .testimonial dt, #sub .testimonial dd { padding-bottom: 10px; }

#sub .testimonials { margin: 0 auto; padding: 13px 0 20px; }
.testimonials .testimonial { position: relative; margin-top: 30px; }
.testimonial .info { position: absolute; right: 0; top: 40px; overflow: hidden; width: 720px; line-height: 60px; background: #fff; }
#sub .testimonial .info h3 { margin: 0; }
#sub .testimonial .info h3 a { display: block; padding: 20px; line-height: 20px; text-decoration: none; color: #30383b; }
.info .moreinfo { position: absolute; right: 0; top: 0; float: right; display: inline; width: 147px; height: 38px; margin: 12px 59px 0; line-height: 38px; text-transform: uppercase; font-size: 90%; color: #fff; background: #2f2f2f; }
.info .moreinfo:hover, .info .moreinfo:focus, .info .moreinfo:active { background: #000; }
.info .moreinfo span { background-image: url('../images/b-viceinformaci.png'); }
.info .moreinfo:hover span, .info .moreinfo:focus span, .info .moreinfo:active span { background-position: -147px 0; }

/*#sub .js .testimonial img { position: relative; }
#sub .js .over img { position: static; }*/

#ShadowBox th, #ShadowBox td { padding: 0; }
