/*
	project: hype (www.hype.hr)
	author: medianova (www.medianova.hr)
*/
*{margin:0;padding:0;}:focus,:active {outline:0}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;}a img{border:0} 
img, div, a, span { behavior: url(css/resources/iepngfix.htc) }
body { font: .9em Arial, Sans-Serif; background: #090D10 url(../images/bg.jpg) no-repeat top center;  color: #DCF1F4; }
body#blogpage { background: url(../images/blog-tile.jpg); }
#blog-header { background: url(../images/blog-background.jpg) no-repeat top center; z-index: -100; height: 800px; width: 100%; position: absolute; }
a { text-decoration: none; color: #E06321; cursor: pointer; }
.red { color: #E06321; }
p  { margin: 0 0 15px; line-height: 1.4em; }
h2 { font-size: 1.3em; margin: 0 0 15px; color: #fff; }
	h2 a { color: #fff; }
h3 { color: #fff; margin: 0 0 10px; }
.clear { clear: both; }

#content { margin: 0 auto; width: 928px; }
	#logo { float: left; margin: 38px 0 22px; }
	#legend { float: left; margin: 28px 0 0 20px; }
	#jobad { position: absolute; top: 0; margin: 0 0 0 -250px; }
	#blogpage #jobad { margin: 0 0 0 20px; }
	#blog-logo { float: left; margin: 66px 0 0; }
	#menu { clear: both; height: 54px; z-index: 100; }
		#menu li { display: inline; vertical-align: middle; }
			#menu li a { float: left; height: 54px; }
			#menu li.home a { background: url(../images/home.gif) no-repeat top; width: 184px; }	
				#menu li.home a:hover, #menu li.home a.current { background: url(../images/home.gif) no-repeat bottom; width: 184px; }	
			#menu li.whatwedo a { background: url(../images/whatwedo.gif) no-repeat top; width: 184px; }
				#menu li.whatwedo a:hover, #menu li.whatwedo a.current { background: url(../images/whatwedo.gif) no-repeat bottom; }
			#menu li.whatwedid a { background: url(../images/whatwedid.gif) no-repeat top; width: 184px; }
				#menu li.whatwedid a:hover, #menu li.whatwedid a.current { background: url(../images/whatwedid.gif) no-repeat bottom; }
			#menu li.contact a { background: url(../images/contact.gif) no-repeat top; width: 184px; }
				#menu li.contact a:hover, #menu li.contact a.current { background: url(../images/contact.gif) no-repeat bottom; }
			#menu li.blog a { z-index: 100; background: url(../images/blog.gif) no-repeat top; width: 188px; }
				#menu li.blog a:hover, #menu li.blog a.current { background: url(../images/blog.gif) no-repeat bottom; }
	
	#chick { position: relative; z-index: -1; height: 310px; width: 223px; margin: -238px 0 0 764px; background: url(../images/chick.png) no-repeat;  }
		
	#language { float: left; width: 100px; font-size: .8em; margin: -20px 0 0 30px; font-weight: bold; }
		#language a { color: #23616D; }
	#side { clear: left; color: #000; font-size: .84em; text-align: justify; width: 211px; padding: 165px 34px 0 20px; float: left; background: url(../images/side.png) no-repeat; height: 337px; margin: 0 0 100px; }
		#side strong { font-size: 1.24em; }

	#shrink { width: 640px; float: right; padding: 10px 0 15px 0; } 
	#main { width: 870px; padding: 0 20px; } 
		#main ul { margin: 0 0 20px; }
		#main li { list-style: circle; margin: 0 0 0 25px; padding: 3px 0; }
		
		#blogpage #main p { font-size: .9em; }
		
		.shrink { width: 640px; float: right; }
		.right { float: right; margin: 0 0 0 15px; }
		.thumb { float: left; margin: 0 30px 10px 0; }
		hr { clear: both; border: 0; height: 0; width: 0; margin: 0 0 10px; background: transparent; }
		
		.title { margin: 0 0 8px; }
		
		#contact-box { float: left; padding: 74px 40px 0 184px; width: 157px; height: 95px; background: url(../images/contact-box.png) no-repeat; } 
		#presentation-box { float: right; padding: 74px 184px 0 30px; width: 167px; height: 95px; background: url(../images/presentation-box.png) no-repeat; } 
		#career-box { float: left; padding: 70px 10px 0 168px; width: 203px; height: 98px; background: url(../images/career-box.png) no-repeat; } 
		#blog-box { float: right; padding: 70px 184px 0 30px; width: 167px; height: 98px; background: url(../images/blog-box.png) no-repeat; } 
		
		#contact-box, #presentation-box { color: #fff; }
		#career-box, #blog-box { font-size: .9em; color: #fff; }
		
		/* portfolio */
		#portfolio { padding: 10px 0 0 20px; position: relative; overflow: hidden; width: 880px; height: 565px; }
		#portfolio-body { width: 860px; height: 565px; background-position: right center; background-repeat: no-repeat; }
		
		/* project listing */
		.column { float: left; width: 300px; margin: 0 0 0 0; }
		.portfolio-thumb { float: left; width: 244px; cursor: pointer; height: 185px; }
		.frame { position: relative; margin: -162px 0 0 -3px; background: url(../images/frame.png) no-repeat; float: left; height: 200px; width: 258px; }
		
		/* specific portfolio project */
		#portfolio-box { margin: 4px 0 0; height: 565px; width: 886px; padding-top: 5px; }
		#portfolio-title { font-size: .74em; position: relative; height: 300px; top: 44px; left: 24px; font-weight: bold; }
		#portfolio-pagination { position: relative; font-weight: bold; top: 115px; left: 30px; height: 100px; line-height: 25px; }
		#portfolio-caption { position: relative; font-size: .74em; top: 124px; text-align: center; }
		#arrow-left { clear: left; float: left; background: url(../images/arrow-left.png) no-repeat; width: 52px; height: 80px; margin: 10px 0 0 30px; }
		#arrow-right { float: right; background: url(../images/arrow-right.png) no-repeat; width: 52px; height: 80px; margin: 10px 10px 0 0; }
		#arrow-back { float: left; position: relative; background: url(../images/arrow-left.png) no-repeat; width: 52px; height: 80px; margin: -320px 0 0 -55px; }
		.lightframe { background: url(../images/framebg.gif) no-repeat 10px 10px; color: #000; }
			.lightframe #portfolio-pagination a { color: #000; }
		.darkframe { background: url(../images/black_frame.gif) no-repeat 10px 10px; color: #fff; }
			.darkframe #portfolio-pagination a { color: #fff; }

		.big a { color: #E06321; }
			
		#bigframe { margin: 0 0 0 5px; background: url(../images/bigframe.png) no-repeat; height: 565px; width: 886px; }
		#projectimg { height: 565px; width: 886px; background-position: center center; background-repeat: no-repeat; }
		
	#footer { clear: both; padding: 25px 0 30px; color: #2A4650; text-align: center; font-size: .84em; font-weight: bold; }
		#footer p { margin: 0; }
		
		.commentsbox input.text, .commentsbox textarea { width: 400px; border: 1px solid #000; }
		.commentsbox textarea { height: 150px; }
		#calc { width: 35px; }
		
	input[type="text"], input[type="password"], textarea, select { color: #000; width: 200px; padding: 5px; border: 1px solid; border-color: #808080 #ddd #ddd #808080; background: #fff; }
	input.button { padding: 8px 20px; background: url(../images/fade.gif) repeat-x; border: 0; border: 1px solid #fff; font-weight: bold; }
	fieldset textarea { height: 400px; width: 98%; }
	legend { background: #fff; padding: 8px 20px; color: #000; }
		legend a { color: #808080; }
	fieldset { color: #000; padding: 15px; background: #ECECEC url(../images/fade.gif) repeat-x; border: 0; width: 100%; margin: 0 0 10px; }
		fieldset a { color: #294148; border-bottom: 1px dotted #294148; }
		
	.section { float: left; background: #fff; border: 1px solid #ddd; padding: 10px; width: 400px; margin: 0 10px 10px 0; }
	.explain { font-size: .84em; color: #808080; }
	#portfolio-textarea { height: 50px; }
	
	/* comments */
	.meta { color: #E06321; font-size: 1.2em; }
	.comment { border-bottom: 1px solid #0C4F5A; padding: 0 0 20px; margin: 0 0 25px; }
	
	.date {  font-size: .9em; margin: 0 0 65px;; }
	.date span { margin: 0 10px 0 0; }