/* Typography
-------------------------------------------------------------- */

body,
input,
textarea { font-family: Georgia, "Times New Roman", Times, serif; color: #333; font-size: 14px; line-height: 18px; }

strong { font-weight: bold; }

input,
textarea { color: black; }

a { text-decoration: none; color: #224388; border-bottom: 1px dashed #213d7a; }

a:hover { color: #FFF; background-color: #213d7a; border-bottom: none; }

a img { border: none; }

h2 { font-size: 23px; line-height: 22px; color: #111; margin: 0 0 25px 0; }

h3 { font-size: 15px; line-height: 22px; color: #3a587c; margin: 0 0 0 0; }

p,
address { line-height: 22px; margin: 0 0 22px 0; }

li { line-height: 22px; }

ul { margin: 0 0 22px 0; }

ul li { list-style: none; background: url(../images/bullet-ok2.gif) no-repeat 0 6px; padding: 0 0 0 18px; margin: 0; }

form { margin: 0; }

input.input-text,
textarea { background: #FFFFFF url(../images/input-text.png) no-repeat; border: 1px solid #d3d3d3; padding: 4px 4px; }

/* Grid
-------------------------------------------------------------- */

.container { width: 892px; margin: 0 auto; }

/* Sets up basic grid floating and margin. */
.column, div.span-1, div.span-2, div.span-3 { float: left;  width: auto; margin-right: 29px; }

/* The last column in a row needs this class. */
.last, div.last { margin-right: 0; }

/* Use these classes to set the width of a column. */
div.span-1  { width: 278px; }
div.span-2  { width: 585px; }
div.span-3  { width: 892px; margin: 0; }

/* Clearfix */
.clearfix:after, .container:after { content:"\0020"; display:block; height:0; clear:both; visibility:hidden; overflow:hidden; }

.clearfix, .container { display:block; }

.clear { clear:both; }

/* Layout
-------------------------------------------------------------- */

body { background: #f6f7f8 url(../images/header-bg.jpg) repeat-x center top; }

#page-bg { background: url(../images/header.jpg) no-repeat center top; }

#page {}

#main-bg { background: url(../images/main.png) repeat-y center top; }

#main { width: 892px; margin: 0 auto; }

/* Header */

#header { position: relative; width: 892px; height: 171px; margin: 0 auto; }

#header h1 { text-align: left; text-indent: -1000px; overflow: hidden; }

#header #headline { font-size: 22px; text-align: center; line-height: 28px; color: #FFF; position: absolute; left: 410px; top: 35px; width: 420px; height: 110px; margin: 0; }	

/* Footer */

#footer { font-size: 13px; text-align: left; background: #eee url(../images/footer.png) no-repeat; width: 892px; padding: 0px 39px; margin: 0 auto; }

#footer-homelink { text-align: right; height: 26px; padding: 2px 0 0 0; }

#footer-main { padding: 12px 0 44px 0; }

#footer-nav { text-align: right; }

/* Navigation */

.nav { font-size: 16px; line-height: 22px; padding: 21px 0 21px; margin: 0 0 0 -4px; }

.nav ul { display: block; padding: 0; margin: 0; }

.nav li { line-height: 18px; list-style: none; background: url(../images/nav-separator.png) right center no-repeat; float: left; width: auto; padding: 0; margin: 0; }

.nav li.last {  background: none; }

.nav li a { text-decoration: none; color: #1d1d1d; border: none !important; display: block; float: left; width: auto; padding: 3px 4px 4px; margin-right: 19px; }

.nav li a:hover { color: #FFF; background-color: #353535; }

.nav li a.active { color: #FFF; background-color: #353535; }

.nav-phone { text-align: right; font-size: 1em; color: #272727; float: right; width: 300px; height: 30px; padding: 0; margin: 0; }

.nav-phone a { font-size: .83em; }

.home-link { font-size: 13px; text-align: right; background: url(../images/icon-on-top.gif) no-repeat right 4px; border: 0; display: block; float: right; width: auto; padding: 0 16px 0 0; margin-top: 6px; }

#footer .home-link { float: none;  width: auto; display: inline; }

/* Sections */

.section { background: url(../images/section-head.png) no-repeat center 29px; margin: 22px 0 0 0; }

/* Portfolio */

#section-portfolio {}

#section-portfolio .images-list { padding-top: 3px; margin-right: -30px; }

#section-portfolio .images-list ul { padding: 0; margin: 0; }

#section-portfolio .images-list li.item { background: none; list-style: none; float: left; width: 307px; height: 264px; padding: 0 0 0 0; margin: 0 0 0 -4px; }

#section-portfolio .images-list li div.image { position: relative; width: 289px; height: 165px; overflow: hidden; }

#section-portfolio .images-list li div.image a { background: url(../images/img-portfolio.png) no-repeat; border: none; display: block; padding: 6px 10px 10px 6px; }

#section-portfolio .images-list li div.image a:hover { background-image: url(../images/img-portfolio-active.png); }

#section-portfolio .images-list li div.image a .img-zoom { background: url(../images/img-zoom-btn.png) no-repeat; display: none; position: absolute; left: 6px; top: 6px; width: 37px; height: 37px; }
/* clearfix */
#section-portfolio .images-list ul ul:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}

#section-portfolio .images-list ul ul { display:block; padding: 0; margin: 0; }

#section-portfolio .images-list li li { font-size: 12px; line-height: 18px; background: url(../images/bullet-ok.gif) no-repeat 1px 6px; float: left; width: 120px; padding: 0 0 0 14px; }

#section-portfolio .images-list h3 { font-size: 1em; color: #111; font-weight: normal; padding: 0; margin: 0; }

#section-portfolio .images-list p { font-size: 12px; line-height: 18px; margin: 0 0 .3em 0; }

#section-portfolio .images-list h3,
#section-portfolio .images-list li,
#section-portfolio .images-list p { margin-left: 9px; }

/* Storitve */

#section-storitve { }

#section-storitve h3 { margin-bottom: 0; }

#section-storitve li { font-size: 13px; line-height: 22px; color: #666; }

#section-storitve-seznam { font-size: 13px; }

#section-storitve-seznam p { font-size: 13px; line-height: 20px; }

#section-storitve-seznam h3 { line-height: 20px; margin-top: 11px; margin-bottom: 4px; }

#section-storitve-seznam img { float: left; margin: 0 6px 0 0; }

#section-storitve-seznam .column p,
#section-storitve-seznam .column h3,
#section-storitve-seznam .column img {  }

#section-storitve-seznam .column.last p,
#section-storitve-seznam .column.last h3 { margin-left: 0; }

#section-storitve-seznam .column.last img { margin-left: 0; }

/* Kontakt */

#section-kontakt { }

.vcard { line-height: 22px; }

.vcard .adr { margin-bottom: 22px; }

.vcard .tel span,
.vcard #email-wrapper span { text-indent: -1000px; display: block; float: right; width: auto; }

.vcard .tel,
.vcard #email-wrapper { font-size: 16px; background: url(../images/icon-phone.png) no-repeat; display: block; padding: 3px 0 4px 35px; margin: 0 0 10px; }

.vcard #email-wrapper { font-size: 14px; border: none; background-image: url(../images/icon-email.png); }

/* Kontakt Form */

form#form-contact { margin-bottom: 22px; }

#contact-form {}

#contact-form p { margin-bottom: 5px; padding-right: 20px; }

#contact-form p.ok { background: url(../images/icon-validate-ok.png) no-repeat right 28px; }

#contact-form p.error { background: url(../images/icon-validate-notok.png) no-repeat right 28px; }

p.error input,
p.error textarea { border-color: #999; }

#contact-form label { line-height: 22px; display: block; width: 120px; padding: 0 0 0 0; margin-bottom: 1px; }

#contact-form input.input-text { width: 248px; margin: 0 0 0 0; }

#contact-form textarea { width: 248px; height: 131px; }

#contact-form .submit { margin: 10px 0 22px; }

#contact-form-status { width: 258px; }

#contact-form-status p { font-size: 13px; line-height: 18px; background: url(../images/icon-ok.png) no-repeat 5px center; border: 1px solid #EAEAEA; margin: 0; padding: 5px 5px 3px 35px; }

/* Thickbox */

#TB_window,
#TB_secondLine { border: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 12px; color: #111; }

#TB_window a { border: none; }

#TB_caption a:visited,
#TB_closeWindow a:visited { color: #224388; }

#TB_caption a,
#TB_closeWindow a { text-decoration: none; color: #224388 !important; border-bottom: 1px dashed #213d7a; }

#TB_caption a:hover,
#TB_closeWindow a:hover { color: #FFF !important; background-color: #213d7a; border-bottom: none; }

#TB_window img#TB_Image { border-color: #CCC; }