@import url('null.css');

/*

		@GENERAL

*/

.cleaner {
	clear: both;
}

.alt {
   display: none;	
}

a {
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
}

p.ok-msg, p.error-msg {
	padding-left: 12px;
	font-size: .8em;
}

p.ok-msg {
	color: white;
}

p.error-msg {
	color: #E50085;
}

/*

		@MAIN

*/

body {   
	font-size: 80%;
	font-family: Tahoma;
	text-align: center;
/*	background: #373737; */
	background: #1a1a1a;
}

div#container {
	width: 100%;
	min-height: 100%;
	_height: 100%;
	position: relative;
}

#container div#page {
	width: 955px;
	margin: 0 auto;
	height: auto;
	padding-bottom: 245px;
	_padding-bottom: 0;
	text-align: left;
	position: relative;
}

/*

		@ADMIN

*/

#page div#admin {
	width: 50px;
	height: 50px;
	padding: 5px;
	line-height: 25px;
	text-align: center;
	background: #4D4D4D;
	position: absolute;
	left: 10px;
	top: 10px;
}

#admin p {
	font-weight: bold;
}

#admin p a, #admin p a:hover {
	color: #FFF200;
}

/*

		@HEADER

*/

div#header {
	width: 440px;
	height: 90px;
	padding-top: 24px;
}

#header div#photo {
	width: 71px;
	height: 72px;
	float: left;
	margin-left: 130px;
	margin-right: 29px;
	background: url(../img/photo.png) left top no-repeat;
}

#header div#logo {
	width: 177px;
	height: 67px;
	float: left;
/*	margin-top: 3px; */
	background: url(../img/logo.png) left top no-repeat;
	position: absolute;
	left: 230px;
	top: 27px;
	top: -67px;
}

#header div#logo h1 a {
	display: block;
	width: 100%;
	height: 67px;
}

#header div#logo h1 a span {
	display: none;
}

/*

		@CONTENT

*/

div#cont {
	z-index: 0;
}

div#cont-left {
	width: 418px;
	float: left;
	margin-left: 130px;
	margin-right: 20px;
}

div#cont-right {
	width: 386px;
	min-height: 200px;
	background: url(../img/cont-right-bg.png) left top repeat-y;
	z-index: 2;
	position: absolute;
	right: 0;
	top: 0;
}

/*

		@STATUS

*/

div#status {
	width: 418px;
	min-height: 50px;
	margin-top: 5px;
	background: #141414;
	position: relative;
}

#status div.top {
	width: 100%;
	height: 22px;
	background: url(../img/status-top.png) left top no-repeat;
	position: absolute;
	left: 0;
	top: -22px;
}

#status div.magpie {
	width: 177px;
	height: 110px;
	background: url(../img/magpie-status.png) left top no-repeat;
	position: absolute;
	right: -18px;
	top: -103px;
}

#status div.magpie2 {
	width: 121px;
	height: 182px;
	background: url(../img/magpie-status2.png) left top no-repeat;
	position: absolute;
	top: -31px;
	left: -111px;
}

#status div.info {
	padding: 3px 12px 0 12px;
}

#status div.info p {
	font-size: .8em;
	color: #333333;
}

#status div.info p span.pdc {
	color: #00a7e8;
}

#status div.cont {
	padding: 10px 12px 12px 12px;
	position: relative;
}

#status div.cont p {
	font-size: 1.2em;
	font-weight: bold;
	color: white;
}

#status div.overlay {
	width: 100%;
	text-align: center;
	opacity: .85;
	background: white;
	cursor: pointer;
	position: absolute;
	left: 0;
	top: 0;
}

#status div.overlay p {
	font-size: .9em;
	color: black;
}

#status textarea, #status input {
	font-family: Tahoma;
	font-size: .8em;
	background: #141414;
	border: 1px solid #333333;
	color: white;
}

#status form {
	padding: 12px;
}

#status textarea {
	width: 100%;
}

#status input {
	margin: 4px 5px 0 0;
}

/*

		@ARTICLES, @SEARCH

*/

div#articles, div#search {
	width: 100%;
/*	margin-top: 8px; */
}

#search h2 {
	padding-left: 12px;
	line-height: 30px;
	font-family: Tahoma;
	font-size: 1.3em;
	color: #fff100;
}

#search p.noRes-info {
	padding-left: 12px;
	font-size: .8em;
	color: white;
}

#articles div.item, #search div.item {
	width: 205px;
	float: left;
	margin-top: 8px;
	margin-right: 8px;
	background: #141414;
/*	border: 1px solid #141414; */
}

#search div.item {
	width: 100%;
	margin-right: 0;
}

#articles div.item:hover {
/*	background: #141414; */
}

#articles div.item.right {
	margin-right: 0;
}

#articles div.item div.cont, #search div.item div.cont {
	padding: 7px 12px 5px 12px;
}

#articles div.item div.cont p.title, #search div.item div.cont p.title {
	font-weight: bold;
	color: #4d4d4d;
}

#articles div.item div.cont p.title a, #articles div.item div.cont p.title a:hover,
#search div.item div.cont p.title a, #search div.item div.cont p.title a:hover {
	color: #4d4d4d;
	text-decoration: none;
}

#articles div.item div.cont p.title a:hover, #search div.item div.cont p.title a:hover {
	color: #fff200;
}

#articles div.item div.cont p.perex, #articles div.item div.cont p.info,
#search div.item div.cont p.perex, #search div.item div.cont p.info {
	font-size: .8em;
}

#articles div.item div.cont p.perex, #search div.item div.cont p.perex {
	width: 100%;
	height: 84px;
	overflow: hidden;
	margin-top: 5px;
	margin-bottom: 5px;
	color: white;
}

#search div.item div.cont p.perex {
	height: 38px;
}

#articles div.item div.cont p.info, #search div.item div.cont p.info {
	margin-top: 3px;
}

#articles div.item div.cont p.info span.comments, #search div.item div.cont p.info span.comments {
	display: block;
	width: 45%;
	height: 12px;
	float: left;
	padding-left: 16px;
	background: url(../img/articles-comments-icon.png) left 2px no-repeat;
	color: #00a7e8;
}

#articles div.item div.cont p.info span.date, #search div.item div.cont p.info span.date {
	display: block;
	width: 45%;
	float: right;
	text-align: right;
	color: #4d4d4d;
}

#articles div.controls {
	width: 100%;
	height: 30px;
	line-height: 30px;
	margin-top: 5px;
	text-align: center;
	font-weight: bold;
	color: #00a7e8;
	position: relative;
}

#articles div.controls p.older, #articles div.controls p.newer {
	width: 20%;
	position: absolute;
	top: 0;
}

#articles div.controls p.older {
	text-align: right;
	right: 0;
}

#articles div.controls p.newer {
	text-align: left;
	left: 0;
}

#articles div.controls p a, #articles div.controls p a:hover {
	font-weight: bold;
	color: #00a7e8;
	text-decoration: none;
}

#articles div.controls p.older a {
	padding-right: 20px;
	background: url(../img/arrows-right.png) right center no-repeat;
}

#articles div.controls p.newer a {
	padding-left: 20px;
	background: url(../img/arrows-left.png) left center no-repeat;
}

/*

		@ARTICLE

*/

div#article {
	padding: 0 12px 0 12px;
	margin-top: 10px;
}

#article p.info, #article p.tags, #article div.cont {
	font-size: .8em;
}

#article p.info {
	color: #333333;
}

#article p.tags {
	color: #808080;
}

#article h2 {
	line-height: 30px;
	font-family: Tahoma;
	font-size: 1.3em;
	color: #fff100;
}

#article div.cont {
	margin-top: 10px;
	font-size: .9em;
	color: white;
}

#article div.cont a, #article div.cont a:hover {
	color: #00a6e7;
}

#article div.cont img {
	padding: 3px;
}

/*

		@CONT RIGHT

*/

#cont-right div.top {
	width: 264px;
	height: 164px;
	background: url(../img/cont-right-top.png) left top no-repeat;
	z-index: -1;
	position: absolute;
	left: 0;
	top: 0;
}

#cont-right div.cont {
	width: 200px;
	margin: 78px 0 0 21px;
	z-index: 1;
}

#cont-right div.magpie-bottom {
	display: none;
	width: 153px;
	height: 53px;
	background: url(../img/magpie-cont-right.png) left top no-repeat;
	position: absolute;
	right: 5px;
	top: 0;
}

/*

		@SEARCH

*/

#cont-right div#search {
	width: 100%;
	height: 25px;
	position: relative;
}

#search input {
	width: 120px;
	height: 21px;
	padding-left: 20px;
	background: #333132 url(../img/srch-image.png) 3px center no-repeat;
	border: 1px solid #232223;
	font-size: .8em;
	color: #141414;
	position: absolute;
	left: 0;
	top: 0;
}

#search input.submit {
	width: 50px;
	height: 25px;
	margin-right: 0;
	padding-left: 0;
	background: url(../img/srch-submit.png) left top no-repeat;
	border: 0 none;
	font-size: .9em;
	font-weight: bold;
	left: 145px;
}

/*

		@CONT RIGHT ARTICLE

*/

#cont-right div.article {
	width: 100%;
	margin-top: 18px;
	text-align: center;
}

#cont-right div.article h2 {
	font-family: Tahoma;
	font-size: 1.3em;
	color: #00a7e8;
}

#cont-right div.article div {
	margin-top: 10px;
	text-align: justify;
	font-size: .8em;
	color: #333333;
}

#cont-right div.article div a, #cont-right div.article div a:hover {
	color: #e50085;
	text-decoration: none;
}

#cont-right div.article div a:hover {
	text-decoration: underline;
}

/*

		@CONTACT

*/

#cont-right div#contact {
	width: 100%;
	margin-top: 18px;
	text-align: center;
	position: relative;
}

#contact div.magpie {
	width: 45px;
	height: 59px;
	background: url(../img/magpie-contact.png) left top no-repeat;
	position: absolute;
	right: -47px;
	top: -10px;
}

#contact h2 {
	font-family: Tahoma;
	font-size: 1.3em;
	color: #00a7e8;
}

#contact form {
	width: 100%;
	margin-top: 10px;
	text-align: left;
}

#contact input, #contact textarea {
	border: 1px solid #232223;
	font-family: Tahoma;
	font-size: .8em;
	color: #141414;
}

#contact input {
	width: 75px;
	height: 21px;
	float: left;
	padding-left: 20px;
}

#contact input#name {
	float: left;
	background: #333132 url(../img/contact-name.png) 3px center no-repeat;
}

#contact input#mail {
	float: right;
	margin-right: 0;
	background: #333132 url(../img/contact-mail.png) 3px center no-repeat;
}

#contact textarea {
	clear: both;
	width: 178px;
	height: 90px;
	margin-top: 5px;
	padding-left: 20px;
	padding-top: 3px;
	background: #333132 url(../img/contact-text.png) 3px 3px no-repeat;
}

#contact input.submit {
	float: right;
	width: 52px;
	height: 25px;
	margin-top: 4px;
	margin-right: 2px;
	background: url(../img/contact-submit.png) left top no-repeat;
	border: 0 none;
}

/*

		@OTHER CONTACTS

*/

#cont-right div#other-contacts {
	width: 100%;
	margin-top: 18px;
	text-align: center;
}

#other-contacts h2 {
	font-family: Tahoma;
	font-size: 1.3em;
	color: #00a7e8;
}

#other-contacts div.cont {
	margin: 10px 0 10px 0;
}

#other-contacts ul {
	width: 156px;
	margin: 0 auto;
	padding-left: 0;
	list-style: none;
}

#other-contacts ul li {
	display: block;
	width: 39px;
	height: 39px;
	float: left;
	text-align: center;
}

#other-contacts ul li a {
	display: block;
	width: 27px;
	height: 27px;
	margin: 0 auto;
	margin-top: 6px;
}

/*

		@RSS

*/

div#rss {
	width: 70px;
	height: 31px;
	background: url(../img/rss.png) left top no-repeat;
	position: absolute;
	left: 85px;
	top: 0;
}

#rss a, #rss a:hover {
	display: block;
	width: 100%;
	height: 31px;
}

/*

		@FOOTER

*/

#container div#footer {
	width: 100%;
	height: 232px;
	text-align: center;
	background: black;
	z-index: 1;
	position: absolute;
	left: 0;
	bottom: 0;
}

#footer div.cont {
	width: 955px;
	margin: 0 auto;
	position: relative;
}

#footer div.magpie {
	width: 124px;
	height: 117px;
	background: url(../img/magpie-footer.png) left top no-repeat;
	position: absolute;
	left: 8px;
	top: -108px;
}

/*

		@PROJECTS

*/

#footer div#projects {
	text-align: left;
}

#projects ul {
	width: 440px;
	margin-left: 120px;
	margin-top: 18px;
	padding-left: 0;
	list-style: none;
}

#projects ul li {
	display: block;
	width: 110px;
	height: 43px;
	float: left;
	cursor: pointer;
}

#projects ul li img {
	margin-top: 3px;
}

/*

		@DISCUSSION

*/

div#discussion {
	margin-top: 18px;
}

#discussion h3 {
	text-align: center;
	font-family: Tahoma;
	font-size: 1.2em;
	color: #333132;
}

#discussion div.toggle {
	width: 394px;
	margin-bottom: 7px;
	padding: 12px;
	background: #141414;
}

#discussion div.toggle div.btn {
	width: 110px;
	height: 20px;
	float: left;
	line-height: 20px;
	text-align: center;
	background: #00a6e7;
	font-size: .8em;
	font-weight: bold;
	cursor: pointer;
}

#discussion div.toggle div.count {
	width: auto;
	height: 20px;
	line-height: 20px;
	float: right;
	padding-left: 16px;
	padding-right: 10px;
	text-align: left;
	font-size: .8em;
	background: url(../img/discussion-comments.png) left 6px no-repeat;
	color: #4d4d4d;
}

#discussion div.comment {
	width: auto;
	margin-top: 10px;
}

#discussion div.comment div.info {
	width: 75px;
	overflow: hidden;
	float: left;
	margin-right: 20px;
}

#discussion div.comment div.avatar {
	width: 70px;
	height: 70px;
/*	background: url(../img/avatar-default.png) left top no-repeat; */
	border: 1px solid #161616;
}

#discussion div.comment div.avatar.pdc {
	background: url(../img/avatar-22.png) 2px 2px no-repeat;
}

#discussion div.comment div.avatar img {
	width: 66px;
	height: 66px;
	margin: 2px 0 0 2px;
}

#discussion div.comment div.info p {
	margin-top: 5px;
	padding-left: 5px;
	font-size: .8em;
	color: #333132;
}

#discussion div.comment div.info p span {
	color: #00a6e7;
}

#discussion div.comment div.info p span.pdc {
	color: #E50085;
}

#discussion div.comment div.text {
	width: 305px;
	min-height: 55px;
	float: left;
	padding: 8px;
	border: 1px solid #141414;
	position: relative;
}

#discussion div.comment div.text div.arrow {
	width: 18px;
	height: 53px;
	background: url(../img/discussion-arrow.png) left top no-repeat;
	position: absolute;
	left: -17px;
	top: 1px;
}

#discussion div.comment div.text p {
	font-size: .8em;
	color: white;
}

/*

		@DISCUSSION FORM

*/

#discussion div.form {
	width: 394px;
	margin-top: 18px;
	padding: 12px;
	text-align: center;
	background: #141414;
	position: relative;
}

#discussion div.form h3 {
	text-align: left;
	font-family: Tahoma;
	font-size: 1.2em;
	color: #333132;
}

#discussion form {
	width: 100%;
	margin-top: 5px;
	text-align: center;
}

#discussion input, #discussion textarea {
	border: 1px solid #232223;
	font-family: Tahoma;
	font-size: .8em;
	color: #141414;
}

#discussion input {
	width: 105px;
	height: 21px;
	float: left;
	margin-right: 5px;
	padding-left: 20px;
}

#discussion input#name {
	background: #333132 url(../img/contact-name.png) 3px center no-repeat;
}

#discussion input#mail {
	background: #333132 url(../img/contact-mail.png) 3px center no-repeat;
}

#discussion input#web {
	margin-right: 0;
	background: #333132 url(../img/contact-web.png) 3px center no-repeat;
}

#discussion textarea {
	clear: both;
	width: 369px;
	height: 90px;
	margin-top: 5px;
	padding-left: 20px;
	padding-top: 3px;
	background: #333132 url(../img/contact-text.png) 3px 3px no-repeat;
	position: relative;
	left: -2px;
}

#discussion input.submit {
	width: 52px;
	height: 25px;
	float: none;
	margin: 0 auto;
	margin-top: 4px;
	margin-right: 2px;
	background: url(../img/contact-submit.png) left top no-repeat;
	border: 0 none;
}

/*

		@CODER

*/

p#coder {
	clear: both;
	margin: 0 auto;
	font-size: .8em;
	color: #333333;
	position: relative;
	top: 15px;
}

p#coder a, p#coder a:hover {
	color: #333333;
	text-decoration: underline;
}

p#coder a:hover {
	color: #00abf2;
}