/* CSS Document 
Acumen Connect [www.acumenconnect.com]
Izrada: Blagonic Brothers [www.blagonic.com]
*/

*{ margin:0px; padding:0px; }
body{ font: 62.5% Arial, Helvetica, sans-serif; text-align:center; color:#595959; background:url(../img/bg-body.jpg) no-repeat center top; }

/* Layout */

/* Main definitions */
h1, h2, h3, h4, h5, h6 { font-family:Calibri, Arial, Helvetica, sans-serif; }
h1 { font-size:3.6em; color:#ed2225; margin-bottom:20px; }
h2 { font-size:3.6em; color:#ed2225; margin:30px; }
h3 { font-size:2.2em; color:#3c3c3c; font-weight:bold; margin-bottom:10px; }
p { font-size:1.6em; line-height:1.67em; margin-bottom:20px; }

a { color:#ed2225; text-decoration:none; }
a:hover { color:#000; text-decoration:none; }

strong { font-weight:bold; color:#434343; }
em { font-weight:bold; font-style:italic; color:#434343; }

/* Layout */
.container { width:940px; margin:0 auto; text-align:left; }

#header { padding:86px 0 30px 0; }
#welcome { background:url(../img/bg-welcome.png) no-repeat center top; }
#usluge { clear:both; }

.alignleft { float:left; }
.alignright { float:right; }
.clear { clear:both; }
.col { margin-left:20px; }
.first { margin-left:0; }

.size4 { width:240px; padding:30px 30px 10px 30px; }
.size8 { width:560px; padding:30px 30px 10px 30px; }
.size12 { width:940px; }

/* 
.size4 { width:300px; }
.size8 { width:620px; }
.size12 { width:940px; }
*/

/* Headnav */
#headnav {  background:url(../img/bg-headnav.png) repeat-x center top; height:56px; position:absolute; top:0; left:0; width:100%; position:fixed; z-index:100; }
#headnav ul { font-size:1.4em; width:920px; margin:0 auto; display:block; }
#headnav ul li { float:left; }
#headnav ul li a { display:block; padding:20px; }
#headnav ul li a:hover { color:#fff; }

/* Welcome */
#welcome p { font-size:1.8em; margin-bottom:20px; }

/* People */
#welcome .people {  }
#welcome .people p { font-size:1.4em; line-height:1.5em; }
#welcome .people img { float:left; margin:5px 10px 10px 0; border:5px solid #fff; }

/* Usluge */
.col { background:#fff url(../img/bg-col.png) no-repeat center top; border-bottom:1px solid #f8f8f8; min-height:220px; position:relative; }
.col h3 { margin-bottom:10px; color:#ed2225; }
.col img { position:absolute; top:-15px; right:10px; display:none; }

/* Portfolio */
#portfolio ul { border-top:1px solid #eee; }
#portfolio ul li { border-bottom:1px solid #eee; padding:30px; float:left; width:880px; clear:both; }

#portfolio ul li.even { background:url(../img/bg-portfolio-shadowleft.jpg) no-repeat right bottom; }
#portfolio ul li.odd { background:url(../img/bg-portfolio-shadowright.jpg) no-repeat left bottom; }

#portfolio ul li .shadow { width:300px; background:url(../img/bg-portfolio-shadow.png) no-repeat center bottom; display:block; margin-top:-30px; padding:0 0 60px 0; text-align:center; }
#portfolio ul li.odd .shadow { float:right; }
#portfolio ul li.even .shadow { float:left; }

#portfolio ul li .shadow img { border:10px solid #fff; }

#portfolio ul li.even p, #portfolio ul li.even h3, #portfolio ul li.even ul.work { margin-left:320px; }
#portfolio ul li.odd p, #portfolio ul li.odd h3, #portfolio ul li.odd ul.work { margin-right:320px; }

#portfolio ul li.odd blockquote { background:url(../img/icons/quote-open.png) no-repeat left top; margin-left:-50px; padding-left:50px; }
#portfolio ul li.even blockquote { background:url(../img/icons/quote-closed.png) no-repeat right top; margin-right:-50px; padding-right:50px; }

#portfolio ul li blockquote { font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; }
#portfolio ul li blockquote p { margin-bottom:10px; color:#777; }
#portfolio ul li blockquote p.preporuka { text-align:right; margin-bottom:0; font-family:Arial, Helvetica, sans-serif; font-size:1.4em; }

#portfolio ul li ul.work { font-size:1.4em; line-height:1.8em; color:#888; border-top:none; }
#portfolio ul li ul.work li { border-bottom:none; padding:0 0 0 20px; background:url(../img/icons/bullet.png) no-repeat left 9px; float:none; clear:none; width:auto; }

/* Kontakt formular */
.kontakt-formular { background: #171717 url(../img/bg-kontakt-formular.png) no-repeat center bottom; padding:30px 90px; height:310px; position:relative; }
.kontakt-formular ul { position:relative; }
.kontakt-formular ul li { width:360px; }
.kontakt-formular ul li label { display:block; font-size:1.8em; padding:8px 0; }
.kontakt-formular ul li input, .kontakt-formular ul li textarea { font-family:Calibri, Arial, Helvetica, sans-serif; background-color:#292929; border:none; color:#a6a6a6; width:340px; padding:13px 10px 14px 10px;; font-size:18px; }
.kontakt-formular ul li textarea { height:130px; } 
.kontakt-formular ul li input.sendbutton { background-color:#000; color:#a4a4a4; width:200px; padding:13px 10px 14px 10px;; font-size:24px; }

.kontakt-formular ul li input:focus, .kontakt-formular ul li textarea:focus { background-color:#ed2225; color:#fff; }
.kontakt-formular ul li input.sendbutton:hover { cursor:pointer; background-color:#ed2225; color:#fff; }

.kontakt-formular ul li.name { position:absolute; top:0; left:0; }
.kontakt-formular ul li.email { position:absolute; top:106px; left:0; }
.kontakt-formular ul li.message { position:absolute; top:0; right:0; }
.kontakt-formular ul li.button { position:absolute; top:230px; right:0; width:200px; }
.kontakt-formular p { position:absolute; top:270px; left:90px; }

.kontakt-formular a:hover { color:#fff; }

#contactforminfo { padding:0 30px; color:#ed2225; font-weight:bold; }

/* Footer */
#footer { padding:30px 30px 60px 30px; }
#footer p {  }

#footer p.copyright { float:left; }
#footer p.created-by { float:right; }
#footer p.created-by a { display:block; margin-top:4px; width:14px; height:14px; text-indent:-8000px; background:url(../img/logo-blagonic.png) no-repeat center top; }


/* Heading replacement */
.heading-replace { display:block; height:35px; text-indent:-8000px; }
#heading-sadrzaj-koji-spaja { background:url(../img/heading-sadrzaj-koji-spaja.png) no-repeat top left; width:300px; }
#heading-usluge { background:url(../img/heading-usluge.png) no-repeat top left; width:120px; }
#heading-projekti { background:url(../img/heading-projekti.png) no-repeat top left; width:220px; }
#heading-kontaktirajte-nas { background:url(../img/heading-kontaktirajte-nas.png) no-repeat top left; width:300px; }