﻿/*******************************************************************
 * Reset tags for all browsers
 *******************************************************************/
	html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, menu,
	time, mark, audio, video { 
		margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
	body { 
		line-height: 1; }
	article, aside, dialog, figure, footer, header,	hgroup, nav, section { 
		display: block; }
	nav ul { 
		list-style: none; }
	blockquote, q { 
		quotes: none; }
	blockquote:before, blockquote:after, q:before, q:after { 
		content: ''; content: none; }
	a { 
		margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
	ins { 
		background-color: #ff9; color: #000; text-decoration: none; }
	del { 
		text-decoration: line-through; }
	abbr[title], dfn[title] { 
		border-bottom: 1px dotted #000; cursor: help; }
	table { 
		border-collapse: collapse; border-spacing: 0; }
	hr { 
		display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }
	input, select { 
		vertical-align: middle; }
	ul {
		list-style: none; }
		
/*******************************************************************
 * Main styles
 *******************************************************************/
	* { font-family: arial, helvetica, sans-seriff; font-size: 12px; margin: 0; padding: 0; }
	a { text-decoration: none; border: none; outline: none; }
	a.image, a.image:hover, a.image:link, a.image:active, a.image:visited { border: none; }
	a:link, a:visited { border: none; color: #166799; }
	a:hover, a:active { border: none; color: #8b0f0f; }
	body { background: transparent url('../images/main/bck-main-repeat.jpg') repeat-x top center; height: 100%; }
	html { height: 100%; }
	img { border: none; }
	ul, li { list-style-type: none; }
	article { font-size: 12px; line-height: 22px; }
	strong { font-size: 100%; }
	input[type=text],
	input[type=password] { border: 1px solid #bbb; padding: 4px; }
	input[type=text]:hover,
	input[type=password]:hover{ border: 1px solid #166799; }
	textarea { border: 1px solid #bbb; padding: 4px; }
	textarea:hover { border: 1px solid #166799; }
	
	#sec-pagination { font-size: 12px; }
	
	blockquote { padding: 8px 15px; background-color: #efefef; margin-bottom: 20px; font-weight: bold; color: #166799; }
	
/*******************************************************************
 * SGW
 *******************************************************************/
	.phototext { position: absolute; width: 100%; bottom: 0; left: 0; background-color: #000; color: #fff; filter:alpha(opacity=70); -moz-opacity: .7; -khtml-opacity: .70; }
	.phototext * { font-size: 10px; font-family: Verdana; line-height: 14px; }
	div.pagination-box { float: right; }
	
	/* Common links styles */
	a.pagination { padding: 1px 3px 1px 3px; border: 1px solid #166799; background-color: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
	a.pagination:hover { background-color: #166799; color: #fff; text-decoration: none; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
	a.paginationselected { background-color: #166799; color: #fff; text-decoration: none; padding: 1px 3px 1px 3px; border: 1px solid #166799; font-weight: bold; -moz-border-radius: 4px; -webkit-border-radius: 4px; }
	
	/* Quote */
	fieldset.quote { font-size: 11px; line-height: 20px; position: relative; margin: 0 0 0 0; padding: 10px 14px 10px 14px; background-color: #FFF; border: 1px solid #991e1e; }
	fieldset.quote * { font-size: 11px; line-height: 20px; }
	fieldset.quote legend { font-weight: bold; top: -.5em; left: .2em; margin: 0; padding: 0; position: absolute; }
	
	/* Bassic button style */
	.button { border: 0px solid !important; display: block; width: 100%; height: 100%; position: relative; overflow: hidden; text-indent: -2000px; }
	.button:hover { background-position: 0 100%; }
	
	/* jForm validation */
	.jcorrect { background: #d7f1da; }
	.jwrong { background: #f4d8d8; }

/*******************************************************************
 * Content boxes
 *******************************************************************/
	 /* Common page layout */
	#home { background: transparent url('../images/main/bck-main-home-repeat.jpg') repeat-x top center; }
	#wrapper { min-height: 100%; position: relative; }
	.page { width: 990px; margin: 0 auto; } 
	* html #wrapper { height: 100%; }
	* html .layout { height: 1px; }answers
	.layout { background: #fff url('../images/main/main-background-upper.jpg') repeat-x top; padding-bottom: 57px; height: 100%; }
	.layout:after { content: " "; display: block; clear: both; }
	.clear { clear: both; }
	.clearl { clear: left; }
	.clearr { clear: right; }
	
/*******************************************************************
 * Header
 *******************************************************************/
	header { width: 950px; margin: 0 auto; background: transparent url('../images/main/teluria-logo.png') no-repeat; height: 102px; position: relative; background-position: 30px 20px; }
	header nav { position: absolute; bottom: 12px; right: 0; }
	header nav ul li { float: left; margin-right: 15px; }
	
	.button-readmore { height: 20px; width: 25px; background-image: url('../images/common/button-readmore.png'); }
	.button-blog { height: 35px; width: 60px; background-image: url('../images/nav/button-blog.png'); }
	.button-contact { height: 35px; width: 108px; background-image: url('../images/nav/button-contact.png'); }
	.button-home { height: 35px; width: 69px; background-image: url('../images/nav/button-home.png'); }
	.button-portfolio { height: 35px; width: 95px; background-image: url('../images/nav/button-portfolio.png'); }

/*******************************************************************
 * Footer
 *******************************************************************/
	footer { background: transparent url('../images/main/bck-main-bottom-repeat.png') bottom center repeat-x; height: 30px; padding: 10px 0 10px 0; width: 100%; position: fixed; bottom: 0; left: 0; z-index: 1000; }
	footer * { text-align: center; font-size: 11px; line-height: 16px; }
	footer a { color: #fff !important; border-bottom: 1px dotted #fff !important; }
	footer div { color: #fff; width: 990px; margin: auto; margin-top: 7px; }

/*******************************************************************
 * Sections
 *******************************************************************/
	#home #intro { position: relative; height: 280px; margin: 0 auto; width: 990px; background: transparent url('../images/main/bck-header.jpg') no-repeat top center; }
	.sec-portfolio { height: 110px; background: transparent url('../images/main/bck-top-portfolio.jpg') no-repeat top center; }
	.sec-contact { height: 110px; background: transparent url('../images/main/bck-top-contact.jpg') no-repeat top center; }
	.sec-blog { height: 110px; background: transparent url('../images/main/bck-top-blog.jpg') no-repeat top center; }
	#art-home { width: 520px; }
	#art-home h1 { text-indent: -2000px; background: transparent url('../images/home/title-graphic-design.gif') no-repeat; height: 52px; }
	#art-home p { font-size: 14px; line-height: 24px; margin: 0 0 20px 20px; }
	#main { margin: 0 auto; width: 910px; padding-bottom: 50px; }
	aside { width: 330px; float: right; font-size: 12px; }
	aside h2 { text-indent: -2000px; background: transparent url('../images/home/title-blog.gif') no-repeat; height: 46px; }
	aside .blog .date { float: left; width: 43px; background: transparent url('../images/home/post-box-date.gif') no-repeat top left; min-height: 100px;}
	aside .blog .date p { color: #fff; padding: 24px 0 0 15px; font-size: 12px; font-weight: bold; line-height: 14px; }
	aside .blog .text { width: 295px; background: transparent url('../images/home/post-box-shadow.gif') no-repeat bottom left; min-height: 100px; margin-left: 43px; }
	aside .blog .text h3 { padding: 15px 15px 7px 15px; font-size: 14px; }
	aside .blog .text h3 a { border: 0px solid; font-weight: bold; }
	aside .blog .text p { padding: 0 15px 15px 15px; font-size: 12px; line-height: 20px; }
	aside#lat-home { width: 340px; }
	
	#website { background: transparent url('../images/main/bck-example-website.png') no-repeat top left; width: 321px; height: 244px; position: absolute; bottom: 20px; right: 50px; }
	#website div { width: 297px; height: 220px; overflow: hidden; margin: 12px 0 0 12px; }

/*******************************************************************
 * Portfolio
 *******************************************************************/
	#portfolio { background: transparent url('../images/portfolio/box-portfolio.png') no-repeat top center; height: 229px; margin: 0 auto; margin-top: 15px; position: relative; }
	#portfolio #arrow-right { position: absolute; width: 50px; height: 44px; top: 66px; right: 12px; z-index: 10; }
	#portfolio #arrow-right .button-arrow-right { height: 44px; width: 50px; background-image: url('../images/portfolio/arrow-right.png'); }
	#portfolio #arrow-left { position: absolute; width: 50px; height: 44px; top: 66px; left: 12px; z-index: 10; }
	#portfolio #arrow-left .button-arrow-left{ height: 44px; width: 50px; background-image: url('../images/portfolio/arrow-left.png'); }
	#portfolio #websites { margin: auto; padding-top: 30px; }
	#portfolio #websites img { border: 0; }
	
	#portfolio .web { width: 226px; height: 220px; float: left; z-index: 8; position: relative; }
	#portfolio .web .cut-more { position: absolute; top: 96px; right: 22px; width: 53px; height: 53px; background: transparent url('../images/teluria-sprites.png') no-repeat; background-position: -156px 0; z-index: 500; }	
	#portfolio .web .image { opacity: 1; width: 206px; height: 161px; margin: 0 auto; background: transparent url('../images/portfolio/box-web-shadow.png') no-repeat top center; }
	#portfolio .web .image div { width: 182px; height: 137px; overflow: hidden; margin: 0 auto; padding-top: 12px; }
	#portfolio .web .link { width: 100%; height: 160px; position: absolute; top: 0; left: 0; text-indent: -5000px; z-index: 1000; }
	#portfolio .web .link a { display: block; width: 100%; height: 160px; border: none !important; }
	#portfolio .web .text {  width: 200px; margin: 0 auto; text-align: center; line-height: 17px; -moz-border-radius: 10px; -webkit-border-radius: 10px; padding-top: 5px; }
	#portfolio .web:hover { }
	#portfolio .web:hover .cut-more { background-position: -156px -58px; }
	#portfolio .web:hover .image { opacity: 1; }
	
	#abydos-sidebar { background: transparent url('../images/portfolio/box-contents.jpg') no-repeat bottom right; min-height: 178px; width: 310px; margin: 35px 46px 0 0; float: right; }
	#abydos-sidebar h2 { text-indent: -2000px; background: transparent url('../images/portfolio/title-abydos.png') no-repeat; height: 52px; }
	#abydos-sidebar p { padding: 0 35px 15px 45px; line-height: 20px; }
	
	#design { min-height: 223px; width: 475px; margin: 35px 0 0 50px; }
	#design h1 { text-indent: -2000px; background: transparent url('../images/portfolio/title-portfolio.gif') no-repeat; height: 52px; }
	#design p { font-size: 14px; line-height: 24px; margin: 0 0 20px 20px; }
	
	#web-details { width: 800px; margin: auto; }
	#web-details h1 { background: transparent url('../images/article/bck-article-title.png') no-repeat; padding: 0 6px 0 15px; -moz-border-radius: 7px; -webkit-border-radius: 7px; color: #fff; font-weight: bold; font-size: 20px; line-height: 43px; }
	#web-details article { width: 500px; }
	#web-details section { margin: 15px 15px 0 15px; }
	

/*******************************************************************
 * Articles
 *******************************************************************/
	#post { width: 500px; margin-left: 40px; margin-top: 20px; }
	#post .date { margin: 10px 0 5px 10px; font-size: 11px; font-weight: bold; color: #166799; }
	#post .date * { font-size: 100%; }
	#post .tags { margin: 10px 0 0 10px; }
	#post > .body { margin-left: 10px; }
	#post > .body > ul { }
	#post > .body > ul li { list-style-type: square; margin-left: 40px; }	
	#post > .body .dp-highlighter * { font-family: "Consolas","Courier New", Courier, mono, serif !important; }
	#post > .body .dp-c li * { font-size: 11px; }
	#post nav * { font-size: 11px; }
	#post h1 { background: transparent url('../images/article/bck-article-title.png'); padding: 0 6px 0 15px; -moz-border-radius: 7px; -webkit-border-radius: 7px; color: #fff; font-weight: bold; font-size: 20px; line-height: 43px; }
	
	#post #answers { }
	#post #answers h2 { margin-bottom: 10px; text-indent: -2000px; background: transparent url('../images/article/title-comments.png') no-repeat; height: 32px; }
	#post #answers ul.answers { }
	#post #answers ul.answers li { margin-bottom: 10px; }
	#post #answers ul.answers li .avatar { float: left; text-align: right; width: 55px; min-height: 95px; position: relative; }
	#post #answers ul.answers li .avatar img { border-left: 2px solid #166799; border-top: 2px solid #166799; border-bottom: 2px solid #166799; margin-top: 15px; }
	#post #answers ul.answers li .shadow { background: transparent url('../images/article/shadow-comments.png') no-repeat top right; position: absolute; width: 100%; height: 95px; top: 0; right: 0; }
	#post #answers ul.answers li dl { margin-left: 55px; width: 440px; background: transparent url('../images/article/box-comments.png') no-repeat bottom right; min-height: 95px; }
	#post #answers ul.answers li dt.info,
	#post #answers ul.answers li dt.info * { font-size: 11px; font-weight: bold; }
	#post #answers ul.answers li dt.info { color: #166799; padding: 15px 15px 0 15px; }
	#post #answers ul.answers li dl dd.body { padding: 0 15px 15px 15px; }

/*******************************************************************
 * Blog
 *******************************************************************/
 	#blogging { background: url('../images/blog/aside-bck-bottom.gif') no-repeat bottom right, url('../images/blog/aside-bck-top.gif') no-repeat top right, url('../images/blog/aside-bck-repeat.gif') repeat-y top right; min-height: 178px; width: 310px; margin: 0 30px 0 0; float: right; }
	#blogging h2 { text-indent: -2000px; background: transparent url('../images/blog/title-tags.png') no-repeat; height: 46px;  }
	#blogging p { padding: 0 35px 15px 45px; line-height: 20px; }
	#blogging ul { margin: 0 0 20px 50px; }
	#blogging ul li { margin-bottom: 10px; }
	#blogging form { margin-left: 50px; margin-bottom: 10px; }
	#blogging input[type=text] { width: 220px; margin-bottom: 10px; }
	#blogging textarea { width: 220px; height: 100px; margin-bottom: 10px; }
	
	#blog-list { width: 562px; }
	#blog-list nav { }
	#blog-list .blog-post { width: 545px; margin-top: 12px; position: relative; min-height: 116px; margin-bottom: 20px; background: transparent url('../images/article/bck-blog-list-post.gif') no-repeat bottom right; }
	#blog-list .blog-post h2 { margin-left: 45px; padding: 5px 0 0 15px; font-size: 110%; }
	#blog-list .blog-post h2 a { border: 0px solid !important; font-size: 110%; font-weight: bold; }
	#blog-list .blog-post .date { width: 45px; color: #fff; font-weight: bold; height: 116px; position: absolute; top: 0; left: 0; background: transparent url('../images/article/img-date-box.jpg') no-repeat top right; }
	#blog-list .blog-post .date p { padding: 22px 0 0 16px; line-height: 14px; }
	#blog-list .blog-post .body { width: 500px; margin-left: 45px; }
	#blog-list .blog-post .body p { padding: 0 10px 10px 15px; }
	#blog-list .blog-post .tags { font-size: 11px; margin-left: 45px; padding-left: 15px; padding-bottom: 5px; }
	#blog-list .blog-post .tags * { font-size: 100%; border: none; }
	
	#write-post-box { width: 534px; height: 288px; margin-top: 15px; }
	#write-post-box h3 { text-indent: -2000px; background: transparent url('../images/article/title-reply.png') no-repeat; height: 32px; }
	#write-post-box #new-post ul { padding: 20px 0 0 0; background: transparent url('../images/blog/bck-reply-post.png') no-repeat top left; height: 300px; }
	#write-post-box #posting-boxes li { margin-bottom: 6px; padding: 0 20px 7px 20px; }
	#write-post-box #posting-boxes li textarea { width: 350px; height: 100px; }
	#write-post-box #posting-boxes li input[type=text],
	#write-post-box #posting-boxes li input[type=password] { width: 275px; }
	#write-post-box #posting-boxes p { font-weight: bold; font-size: 13px; color: #20587b; float: left; width: 100px; padding-left: 10px; }
	
/*******************************************************************
 * Contact
 *******************************************************************/
	#contact { min-height: 223px; width: 475px; margin: 0 0 0 60px; }
	#contact h1 { text-indent: -2000px; background: transparent url('../images/blog/title-about-me.gif') no-repeat; height: 52px; }
	#contact p { font-size: 14px; line-height: 24px; margin: 0 0 20px 20px; }
	#contact dl { padding: 8px; margin-left: 20px; width: 120px; -moz-border-radius: 10px; -webkit-border-radius: 10px; background: #166799; float: left; color: #fff; }
	#contact dl > dt { font-weight: bold; margin-left: 10px; }
	#contact dl > dd { margin-left: 20px; }
	
	#blogging form { width: 230px; }
	#blogging #send { width: 92px; margin: auto; }
	
	.button-send 		{ height: 37px; width: 92px; background: transparent url('../images/teluria-sprites.png'); background-position: 0 0; }
	.button-send:hover 	{ height: 37px; width: 92px; background: transparent url('../images/teluria-sprites.png'); background-position: 0 -37px; cursor: pointer; }
	.button-read-more 		{ height: 23px; width: 79px; background: transparent url('../images/teluria-sprites.png'); background-position: 0 -74px; margin: 3px 0 0 0; }
	.button-read-more:hover	{ height: 23px; width: 79px; background: transparent url('../images/teluria-sprites.png'); background-position: 0 -97px; cursor: pointer; }

 	#contact-form { background: url('../images/blog/aside-bck-bottom.gif') no-repeat bottom right, url('../images/blog/aside-bck-top.gif') no-repeat top right, url('../images/blog/aside-bck-repeat.gif') repeat-y top right; min-height: 178px; width: 310px; margin: 0 30px 0 0; float: right; }
	#contact-form h2 { text-indent: -2000px; background: transparent url('../images/contact/title-contact.png') no-repeat; height: 49px;  width: 108px; }
	#contact-form p { padding: 0 35px 15px 45px; line-height: 20px; }
	#contact-form ul { margin: 0 0 20px 50px; }
	#contact-form ul li { margin-bottom: 6px; }
	#contact-form form { margin-left: 50px; margin-bottom: 10px; }
	#contact-form input[type=text] { width: 220px; margin-bottom: 10px; }
	#contact-form textarea { width: 220px; height: 100px; margin-bottom: 10px; }

/*****************************************************************************************
 * Style for portfolio slider
 *****************************************************************************************/
	.jcarousel-container { position: relative; margin-left: 15px; }
	.jcarousel-container img { border: 0; }
	.jcarousel-clip { z-index: 2; padding: 0; margin: 0; overflow: hidden; position: relative; }
	.jcarousel-list { z-index: 1; overflow: hidden; position: relative; top: 0; left: 0; margin: 0; padding: 0; }
	.jcarousel-list li,
	.jcarousel-item { float: left; list-style: none; width: 226px; height: 220px; }
	.jcarousel-next,
	.jcarousel-prev { width: 50px; height: 44px; z-index: 3; }
	.jcarousel-container {}
	.jcarousel-container-horizontal { }
	.jcarousel-clip-horizontal { width: 678px; height: 220px; }
	.jcarousel-item { width: 226px; height: 220px; }
	.jcarousel-item-horizontal { }
	.jcarousel-item-vertical { }
	.jcarousel-item-placeholder { background: #fff; color: #000; }
	
	.jcarousel-prev { position: absolute; top: 100px; left: 85px; width: 32px; height: 19px; padding: 0; margin: 0; background: transparent url('../images/teluria-sprites.png') no-repeat top left; cursor: pointer; background-position: -124px 0; }
	.jcarousel-prev:hover { background-position: -124px -19px; }
	.jcarousel-next { position: absolute; top: 100px; right: 85px; width: 32px; height: 19px; padding: 0; margin: 0; background: transparent url('../images/teluria-sprites.png') no-repeat top left; cursor: pointer; background-position: -92px 0; }
	.jcarousel-next:hover { background-position: -92px -19px; }
	
	.jcarousel-prev-disabled,
	.jcarousel-next-disabled { display: none !important; }
	
	/* Addon: Gallery Viewer */
	#fancybox-wrap a:hover { border: 0px solid #000; }
	 
	/* Addon: Gallery Viewer */
	#post ul#image-gallery { list-style-type: none; margin-top: 20px; }
	#post ul#image-gallery * { padding: 0 !important; border-bottom: 0px solid !important; }
	#post ul#image-gallery li { margin: 10px 0 10px 0 !important; list-style-type: none; }
	#post ul#image-gallery li dt { float: left; margin-right: 17px !important; width: 170px; height: 100px; overflow: hidden; }
	#post ul#image-gallery li dd { float: left; margin-right: 17px; width: 150px; height: 100px; overflow: hidden; }
	#post ul#image-gallery li dd.last { margin-right: 0 !important;}
	#post ul#image-gallery li img { width: 170px; }
	
	#gallery-image-footer { border: 1px solid rgb(215, 216, 217); margin: auto; background: rgb(236, 239, 242) url('/apps/kultu/addons/galleryViewer/images/image-foot-bck.png') repeat-x center bottom; width: 600px; }
	#gallery-image-footer div { padding: 10px; }

	html body #web-details aside { width: 220px; }
	html body #web-details aside ul#image-gallery { list-style-type: none; margin-top: 20px;  }
	html body #web-details aside ul#image-gallery * { padding: 0 !important; }
	html body #web-details aside ul#image-gallery li { width: 210px; margin: 10px 0 10px 0 !important; list-style-type: none; }
	html body #web-details aside ul#image-gallery li dl { margin-top: 60px; }
	html body #web-details aside ul#image-gallery li dt { margin-top: 20px; width: 200px; border: 1px solid #ccc; }
	html body #web-details aside ul#image-gallery li dd { margin-top: 20px; width: 200px; border: 1px solid #ccc; }
	html body #web-details aside ul#image-gallery li dd.last { margin-right: 0 !important;}