@import url("fontovi.css");
@import url("firefox.css");

body { margin:0; padding:0; width:100%; background:url(../slices/bg_body.jpg) repeat;  }

.crveni { color:#FE4A17; }
.sivi { color:#333; }
img { border:none; }

header, article, section, footer { display: block; } /* firefox i ie samo */

.header { width:1140px; height:540px; margin:0 auto 0 auto; padding:0; }
.header .shadow { width:900px; height:50px; margin:0 auto 0 auto; padding:0; background:url(../slices/bg_headerTop.jpg); }
.header .grid { width:664px; height:308px; margin:-15px auto 0 auto; padding:0; background:url(../slices/bg_headerGrid.jpg); }
.header .logo { width:270px; height:230px; margin:-310px auto 0 auto; padding:0; background:url(../slices/header_logo.png) no-repeat top center; }
.header .logo h1 { font: 17px/17px 'EastMarketRegular', Tahoma, sans-serif; color:#FE4A17; width:auto; height:auto; padding:167px 0 0 0; margin:0 auto 0 auto; text-align:center; text-shadow:#FFC4B3 0px 0px 4px; }
.header .logo h2 { font: 20px/20px 'EastMarketRegular', Tahoma, sans-serif; color:#333; width:auto; height:auto; padding:8px 0 0 0; margin:0 auto 0 auto;  text-align:center; text-shadow:#ccc 0px 0px 4px; }

.header .intro { width:auto; height:auto; margin:15px auto 0 auto;  }
.header .intro h1 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:21px; font-weight:normal; width:auto; height:auto; padding:0 0 0 15px; margin:0 auto 0 auto; text-align:center; }
.header .intro h2 { font: 100px/100px 'EastMarketRegular', Tahoma, sans-serif; width:960px; height:auto; padding:10px 0 0 0; margin:0 auto 0 auto; text-align:center; text-shadow:#ccc 0px 0px 4px; position:relative; }
.header .intro h2:first-letter {  }
.header .intro h2 .b { margin:-26px 0 0 40px; padding:0; float:left; }
.header .intro .buddy { width:150px; height:160px; margin:-47px 0 0 69px; padding:0; background:url(../slices/header_Buddy.jpg); }
.header .intro .ballon { width:847px; height:75px; margin:-92px 0 0 202px; padding:0; background:url(../slices/header_ballon.jpg); }
.header .intro .ballon h1 { font: 20px/20px 'EastMarketRegular', Tahoma, sans-serif; color:#FE4A17; width:auto; height:auto; padding:23px 0 0 4px; margin:0 auto 0 auto; text-align:center; }

.header .right { width:145px; height:auto; margin:-521px 0 0 982px; padding:0; }
.header .right .language { width:auto; height:auto; margin:-284px 0 0 33px; padding:0 0 0 0;  }
.header .right .language a { text-decoration:none; font: 22px/22px 'CodaHeavy', Tahoma, sans-serif; margin:; padding:5px; }
.header .right .language a:hover { text-decoration:none; color:#FE4A17; }
.header .right .language .active { color:#FE4A17; }
.header .right .language .neactive { color:#333; }
.header .right .ribbon { width:145px; height:323px; margin:0 auto 0 auto; padding:0; background:url(../slices/header_rightRibbon.png); }
.header .right .ribbon p { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:16px; font-weight:bold; color:#fff; padding:0 0 0 10px; margin:0; text-align:center; }
.header .right .ribbon p:first-child { padding:209px 0 0 10px; margin:0;  }


a.lightbox  { text-decoration:none; color:#333; }
.portfolio { width:1140px; height:auto; margin:0 auto 0 auto; }
.portfolio img { border:none; padding:13px 13px 30px 13px; background:url(../slices/portfolio_pic_bg.png) no-repeat;  margin-top:5px; }
.portfolio_alpha_left { position:absolute; z-index:9; width:50px; height:206px; margin:6px 0 0 0; padding:0; background:url(../slices/portfolio_alpha_left.png); }
.portfolio_alpha_right { position:absolute; z-index:8; width:50px; height:206px; margin:6px 0 0 1090px; padding:0; background:url(../slices/portfolio_alpha_right.png); }
.portfolio a img { 
				  -webkit-transform: scale(0.98);
		          -webkit-transition-timing-function: ease-in;
		          -webkit-transition-duration: 500ms;
				  -moz-transform: scale(0.98);
		          -moz-transition-timing-function: ease-out;
		          -moz-transition-duration: 100ms;
				  -o-transform: scale(0.98);
		          -o-transition-timing-function: ease-out;
		          -o-transition-duration: 500ms;
				  transform: scale(0.98);
		          transition-timing-function: ease-out;
		          transition-duration: 500ms;
				 
}			
.portfolio a:hover img  {  
				  -webkit-transform: scale(1.0);
		          -webkit-transition-timing-function: ease-out;
		          -webkit-transition-duration: 500ms;
				  -moz-transform: scale(1.0);
		          -moz-transition-timing-function: ease-out;
		          -moz-transition-duration: 100ms;
				  -o-transform: scale(1.0);
		          -o-transition-timing-function: ease-out;
		          -o-transition-duration: 500ms;
				  transform: scale(1.0);
		          transition-timing-function: ease-out;
		          transition-duration: 500ms; 
}
.info { width:200px; height:auto; font: 14px/14px 'junctionregularRegular', Tahoma, sans-serif; color:#333; margin:-30px 0 0 10px; padding:0; position:absolute; }


.ponuda { width:1140px; height:540px; margin:70px auto 0 auto; padding:0; }
.about { width:640px; height:auto; margin:0; padding:0; }
.about_me { width:510px; height:285px; margin:-247px 0 0 146px; padding:0; background:url(../slices/about_me_bg.jpg) no-repeat left; }
.about_me h1 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:25px; font-weight:normal; text-shadow:#ccc 0px 0px 4px; color: #999; padding:35px 0 0 35px; width:auto; height:auto; }
.about_me h2 { font: 14px/14px 'junctionregularRegular', Tahoma, sans-serif; color:#333; line-height:24px; padding:0 0 0 35px; margin:-12px 0 0 0; text-align:justify; }

.skills { width:auto; height:auto; margin:-276px 0 0 725px; padding:0; }
.skills h1 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:25px; font-weight:normal; text-shadow:#ccc 0px 0px 4px; color: #999; padding:0; width:auto; height:auto; }
.skills h2 { font: 15px/15px 'junctionregularRegular', Tahoma, sans-serif; color:#999; font-weight:normal; }
.skills h2 .html { width:150px; height:auto; padding:3px 0 0 0; margin:-9px 0 0 0; background:url(../slices/stars_4-5.jpg) no-repeat right; }
.skills h2 .css { width:150px; height:auto; padding:3px 0 0 0; margin:12px 0 0 0; background:url(../slices/stars_4-5.jpg) no-repeat right; }
.skills h2 .jquery { width:150px; height:auto; padding:3px 0 0 0; margin:12px 0 0 0; background:url(../slices/stars_3-5.jpg) no-repeat right; }
.skills h2 .flash { width:150px; height:auto; padding:3px 0 0 0; margin:12px 0 0 0; background:url(../slices/stars_3-5.jpg) no-repeat right; }
.skills h2 .design { width:150px; height:auto; padding:3px 0 0 0; margin:12px 0 0 0; background:url(../slices/stars_4-5.jpg) no-repeat right; }
.skills .ballon { width:251px; height:55px; margin:-211px 0 0 160px; padding:0; background:url(../slices/skills_ballon.jpg); position:absolute; }
.skills .ballon p { font: 12px/12px 'junctionregularRegular', Tahoma, sans-serif; color:#999; font-weight:normal; font-style:italic; padding:11px 0 0 27px; }
.skills .experience { width:auto; height:auto; margin:-140px 0 0 175px; padding:0; }
.skills .experience .big { font: 80px/80px 'EastMarketRegular', Tahoma, sans-serif; color:#FE4A17; width:auto; height:auto; padding:0; margin:0;   text-shadow:#fff 1px 1px 0px; }
.skills .experience .small { font: 30px/30px 'EastMarketRegular', Tahoma, sans-serif; color:#999; width:200px; height:auto; padding:0; margin:-58px 0 0 58px;   text-shadow:#fff 1px 1px 0px; }


.dash_line_1 { width:100%; height:2px; margin:-228px auto 0 auto; background:url(../slices/line_horizontal.jpg) repeat-x; }
.dash_line_2 { width:100%; height:2px; margin:330px auto 0 auto; background:url(../slices/line_horizontal.jpg) repeat-x; }


.question { margin:150px 0 0 70px; padding:0; width:380px; height:255px; }
.q_icon { width:43px; height:43px; margin:0; padding:0; background:url(../slices/question_icon.jpg); position:absolute; }
.q_icon_line { width:2px; height:105px; margin:0 0 0 21px; padding:0; background:url(../slices/line_vertikal.jpg) repeat-y; }
.question h1 { font: 70px/70px 'EastMarketRegular', Tahoma, sans-serif; color:#FE4A17; margin:5px 0 0 -2px; padding:0; -webkit-font-smoothing: antialiased; text-shadow:#ccc 0px 0px 10px; } 
.question h1 p { font: 40px/40px 'EastMarketRegular', Tahoma, sans-serif; color:#FE4A17; margin:-5px 0 0 2px; padding:0; letter-spacing:1px; }
.question h2 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:22px; font-weight:normal; color:#666; margin:0 0 0 188px; }
.question_line { width:105px; height:2px; background:url(../slices/line_horizontal.jpg) repeat-x; margin:-70px 0 0 270px; padding:0; }

.answer { width:630px; height:255px; padding:0; margin:-203px 50px 0 0; float:right; } 
.answer p { font: 15px/22px 'junctionregularRegular', Tahoma, sans-serif; color:#333; font-weight:normal; float:left;  } 
.mail_icon { width:43px; height:43px; margin:-52px 0 0 540px; padding:0; background:url(../slices/mail_icon.jpg); position:absolute; }
.answer_line_1 { width:2px; height:134px; margin:-77px 0 0 561px; padding:0; background:url(../slices/line_vertikal.jpg) repeat-y; position:absolute; }
.answer_line_2 { width:171px; height:2px; background:url(../slices/line_horizontal.jpg) repeat-x; margin:55px 0 0 390px; padding:0; position:absolute; }
a.logo { width:90px; height:91px; display:block; text-decoration:none; border:none; background:url(../slices/icon_1.jpg); margin:0; padding:0; float:left;  }
.logo_hover { width:90px; height:91px; background:url(../slices/icon_1_hover.jpg); margin:-1px 0 0 0; padding:0; opacity:0.0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; }
a:hover.logo  .logo_hover { opacity:1.0; cursor:pointer; }
a:hover.logo  .icon_tip_1 { opacity:1.0; cursor:pointer; }
.icon_tip_1 { width:90; height:62px; background:url(../slices/icon_tip.png); margin:-60px 0 0 0; padding:0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; opacity:0.0; }
.icon_tip_1 h1 { font: 14px/18px 'junctionregularRegular', Tahoma, sans-serif; color:#fff; font-weight:normal; width:90px; padding:0; margin:9px 0 0 0; text-align:center; }

a.tisak { width:90px; height:91px; display:block; text-decoration:none; border:none; background:url(../slices/icon_2.jpg); margin:0; padding:0; float:left; }
.tisak_hover { width:90px; height:91px; background:url(../slices/icon_2_hover.jpg); margin:-1px 0 0 0; padding:0; opacity:0.0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; }
a:hover.tisak  .tisak_hover { opacity:1.0; cursor:pointer; }
a:hover.tisak  .icon_tip_2 { opacity:1.0; cursor:pointer; }
.icon_tip_2 { width:90; height:62px; background:url(../slices/icon_tip.png); margin:-60px 0 0 0; padding:0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; opacity:0.0; }
.icon_tip_2 h1 { font: 14px/18px 'junctionregularRegular', Tahoma, sans-serif; color:#fff; font-weight:normal; width:90px; padding:0; margin:9px 0 0 0; text-align:center; }
a.anim { width:90px; height:91px; display:block; text-decoration:none; border:none; background:url(../slices/icon_3.jpg); margin:0; padding:0; float:left; }
.anim_hover { width:90px; height:91px; background:url(../slices/icon_3_hover.jpg); margin:-1px 0 0 0; padding:0; opacity:0.0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; }
a:hover.anim  .anim_hover { opacity:1.0; cursor:pointer; }
a:hover.anim  .icon_tip_3 { opacity:1.0; cursor:pointer; }
.icon_tip_3 { width:90; height:62px; background:url(../slices/icon_tip.png); margin:-60px 0 0 0; padding:0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; opacity:0.0; }
.icon_tip_3 h1 { font: 14px/18px 'junctionregularRegular', Tahoma, sans-serif; color:#fff; font-weight:normal; width:90px; padding:0; margin:9px 0 0 0; text-align:center; }
a.seo { width:90px; height:91px; display:block; text-decoration:none; border:none; background:url(../slices/icon_4.jpg); margin:0; padding:0; float:left; }
.seo_hover { width:90px; height:91px; background:url(../slices/icon_4_hover.jpg); margin:-1px 0 0 0; padding:0; opacity:0.0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; }
a:hover.seo  .seo_hover { opacity:1.0; cursor:pointer; }
a:hover.seo  .icon_tip_4 { opacity:1.0; cursor:pointer; }
.icon_tip_4 { width:90; height:62px; background:url(../slices/icon_tip.png); margin:-60px 0 0 0; padding:0; position:absolute; -webkit-transition:opacity 150ms ease-in; -moz-transition:opacity 150ms ease-in; -o-transition:opacity 150ms ease-in; transition:opacity 150ms ease-in; opacity:0.0; }
.icon_tip_4 h1 { font: 14px/18px 'junctionregularRegular', Tahoma, sans-serif; color:#fff; font-weight:normal; width:90px; padding:0; margin:9px 0 0 0; text-align:center; }
.answer_tip { width:140px; height:50px; margin:20px 0 0 365px; padding:0; background:url(../slices/strelica.jpg) left bottom no-repeat; }
.answer_tip p { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:22px; font-weight:normal; color:#666; margin:0 0 0 40px; padding:10px 0 0 0;}
.mail_info { width:auto; height:auto; margin:5px 0 0 224px; padding:0; }  
.mail_info a { text-decoration:none; color:#FE4A17; font-size:15px; font-weight:bold; }
.mail_info a:hover { color:#333; }


.details { width:1140px; height:160px; margin:70px auto 0 auto; padding:0; }

.freelancer { width:146px; height:120px; margin:-171px 0 0 900px; padding:0; position:absolute; background:url(../slices/freelancer_anim_1.jpg); }
.details_left { width:350px; height:270px; margin:-91px 0 0 100px; padding:0; position:absolute; }
.details_left h1 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:26px; font-weight:normal; color:#999; margin:0; padding:0; background:url(../slices/bg_body.jpg) repeat; text-align:center; width:220px; text-shadow:#ccc 0px 0px 4px; }
.links_1 { width:auto; height:auto; margin:10px 0 0 20px; padding:0; float:left; font: 13px/23px 'junctionregularRegular', Tahoma, sans-serif; }
.links_2 { width:auto; height:auto; margin:10px 0 0 30px; padding:0; float:left; font: 13px/23px 'junctionregularRegular', Tahoma, sans-serif; }
.links_1 a, .links_2 a { text-decoration:none; color:#999; display:block; }  
.links_1 a:hover, .links_2 a:hover { text-decoration:none; color:#FE4A17; } 
.details_right { width:470px; height:270px; margin:-91px 0 0 590px; padding:0; position:absolute; }
.details_right h1 { font-family: 'Covered By Your Grace', Tahoma, sans-serif; font-size:26px; font-weight:normal; color:#999; margin:0; padding:0; background:url(../slices/bg_body.jpg) repeat; text-align:center; width:160px; text-shadow:#ccc 0px 0px 4px; }
.details_right p { width:auto; height:auto; margin:10px 0 0 20px; padding:0; float:left; font: 13px/23px 'junctionregularRegular', Tahoma, sans-serif; text-align:justify; font-style:italic; color:#999; }
.details_right p a { text-decoration:none; color:#FE4A17; }


.footer_shadow { width:931px; height:34px; margin:0 auto 0 auto; background:url(../slices/footer_shadow_bg.jpg); }
.footer_holder { width:100%; height:130px; margin:0 auto 0 auto; padding:0; background:url(../slices/footer_bg.jpg) repeat-x; }
.footer { width:1140px; height:130px; margin:-5px auto 0 auto; padding:0; }
.facebook { width:auto; height:auto; margin:-40px 0 0 108px; padding:0; position:absolute; }
.contact_info { width:auto; height:auto; margin:5px 0 0 110px; padding:12px 0 0 0; color:#fff; font: 13px/18px 'junctionregularRegular', Tahoma, sans-serif; }
.footer_logo { width:151px; height:151px; margin:-143px auto 0 auto; padding:0; background:url(../slices/footer_logo.png); }



/*   TIPSY   */
.tipsy { margin:-216px 0 0 -113px; padding: 0px 0px 0px 0px; position: absolute; z-index: 10; font: 12px/12px 'junctionregularRegular', Tahoma, sans-serif;  border-radius: 5px; -moz-border-radius:5px; -webkit-border-radius:5px; }
  .tipsy-inner { padding: 10px 15px 10px 15px; background-color:#FE4A17; color: #fff; max-width:300px; text-align: center; }
  .tipsy-inner { border-radius: 5px; -moz-border-radius:5px; -webkit-border-radius:5px; }
  .tipsy-arrow { position: absolute; z-index: 9; background: url('../slices/tipsy.gif') no-repeat top left; width: 9px; height: 5px; }
  .tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
  .tipsy-s .tipsy-arrow { top:100%; bottom:0; left: 50%; margin-left: -4px; background-position: bottom left; }
    .tipsy-sw .tipsy-arrow { bottom: 0; top:32px; left: 10px; background-position: bottom left; }
    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
  .tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
  .tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }
/*   END TIPSY   */