/* 
   This is an interplaymedium.com style sheet
   created by Dmitry Shalnoff (c)2012 interplaymedium.org
   Licensed under GPL 
*/


@font-face 	{ 	font-family: "capsuula"; 
			src: 	url('/fonts/Capsuula.eot'); /* IE9 Compat Modes */
		 	src: 	url('/fonts/Capsuula.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
				url('/fonts/Capsuula.woff') format('woff'), /* Modern Browsers */
				url('/fonts/Capsuula.ttf') format('truetype'), /* Safari, Android, iOS */
				url('/fonts/Capsuula.svg#Capsuula') format('svg'); /* Legacy iOS */
		}

html, body 	{ margin:0; padding:0; height:100%; background-color:#4d4d4d; min-width: 1150px; min-height:100%; background: url(/img/bg_gradient_bg.jpeg) }

a 		{ color:#cccccc; text-decoration:none; margin: 0; padding: 0; border-bottom: 1px dashed; white-space:nowrap }
a:hover 	{}
a:focus 	{ outline: 0px }
img, h1, h2, p	{ padding: 0; margin: 0; border: 0 }

#container 	{ min-height:100%; position:relative; padding: 0; background: url(/img/bg.jpeg) no-repeat center }

.shifted	{ padding-left: 40px } 	/* this is a class for centering the content */
.hid		{ display: none }
.clear 		{ clear:both; }
.bottomspacer	{ height: 65px }

/*  div { border: #f00 1px dashed; }*/

/* --------------- top menu -----------------*/

#mainmenu		{ position: relative; display: block; height: 118px; background-color: #454545; }
#mainmenu a 		{ position: absolute; top: 25px; display: inline-block; border-bottom: none; margin: 0px 30px 15px 20px; }
#mainmenuList		{ position: absolute; top: 25px; margin-left: 168px; display: inline-block; }
#mainmenuList a		{ position: relative; margin: 0 10px; padding: 0; padding-bottom: 13px; border-bottom: none; color: #707070; font:40px 'capsuula', sans-serif; }

#mainmenuList a.selected, #mainmenuList a:hover	{ border-bottom: 6px #b5eb00 solid }

/* --------------- left menu ----------------*/

#leftmenu		{ position: absolute; top: 150px; z-index: 5 }
#leftmenu a		{ display: block; width: 0; background-color: #454545; border-bottom: none; margin-bottom: 1px }
#leftmenu a span	{ display: block; border-left: 6px #3d3d3d solid; border-bottom: none; padding-left: 10px; color: #999999; font: 30px 'capsuula', sans-serif; }

#leftmenu a:hover span, #leftmenu a span.selected	{ border-left: 6px #b5eb00 solid }

/* --------------- central scheme -----------*/

#scheme			{ display: block;  margin: 10px 0 0 -10px }
#scheme .container	{ position: relative; height: 804px; }
#scheme	img		{ position: absolute; top: 0; left: 0; margin: 0; padding: 0; }
#scheme	a		{ position: absolute; display: block; width: 41px; height: 41px; z-index: 5; border: none; background: url(/img/round.png); color:#808080; text-align: center; font: bold 20px Arial, sans-serif; line-height: 41px; }
#scheme	a:hover		{ background-position: 0 -42px; color:#4d4d4d; }

/* --------------- comments -----------------*/

#listitem		{ max-width: 1000px; margin-top: 40px }

h1			{ color:#808080; font: 50px 'capsuula'; margin-left: 15px; }		

ol			{ font: normal 17px Arial, sans-serif; color:#909090; line-height: 25px; margin-left: 15px;}
li			{ width: 100%; padding-bottom: 20px }
li h2			{ font: normal 17px Arial, sans-serif; text-transform: uppercase }

#comment		{ position: absolute; z-index: 15; top: 200px; width: 100%; }
#comment div.title	{ background-color: rgba(50, 50, 50, 0.9); margin-top: 50px; }
#comment div.title h2	{ color:#909090; font: 30px 'capsuula', sans-serif; padding: 10px 100px 10px 15px; }
#comment div.txt	{ background-color: rgba(179, 179, 179, 0.9); }
#comment div.txt p	{ max-width: 900px; font: normal 17px Arial, Helvetica, sans-serif; line-height: 25px; color:#222; padding: 10px 100px 10px 15px;  }

#comment span.ontop { 
	content: ' '; 
	position: absolute; 
	width: 0; 
	height: 0; 
	left: 30px; 
	top: 0px; 
	border: 25px solid; 
	border-color: transparent transparent rgba(50, 50, 50, 0.9) rgba(50, 50, 50, 0.9); 
}

#comment span.onbottom { 
	content: ' '; 
	position: absolute; 
	width: 0; 
	height: 0; 
	left: 30px; 
	bottom: -50px; 
	border: 25px solid; 
	border-color: rgba(179, 179, 179, 0.9) rgba(179, 179, 179, 0.9) transparent transparent ; 
}

/* ---------------- list of items --------- */

.listitem		{ margin: 0; width: 1100px; }
.listcontainer		{ position: relative; background: #878787; margin: 23px 0 1px 20px; padding: 0 }
.listcontainer img	{ padding-right: 20px; display: block; width: 751px }
.listcontainer h1	{ position: absolute; right: 0; top: 0px; width: 310px; height: 60px; background: #3b3b3b; margin: 0; padding: 8px 0 0 20px; font:40px 'capsuula', sans-serif; }
.listcontainer p	{ position: absolute; right: 0; top: 60px; width: 290px; margin: 20px 20px 10px 30px; font: normal 17px Arial, Helvetica, sans-serif; color:#444; line-height: 25px; }


.listitem .listcomment		{ padding: 0; margin: 0 0 0 20px; background: #9b9b9b; overflow: hidden; }
.listitem .listcomment h2	{ font: 35px 'capsuula', sans-serif; color:#3b3b3b;  padding: 15px 0 0 20px; }
.listitem .listcomment p	{ width: 700px; margin: 10px 20px; padding-bottom: 20px; font: normal 14px Arial, Helvetica, sans-serif; color:#313131; line-height: 22px; }

.listitem .listcomment p	{
			-moz-column-count: 2;
			-moz-column-gap: 5px;
			-moz-column-rule: none;
			-webkit-column-count: 2;
			-webkit-column-gap: 5px;
			-webkit-column-rule: none;
			/* future proof */
			column-count: 2;
			column-gap: 5px;
			column-rule: none;
	}

.more		{ position: absolute; display: block; right: 20px; bottom: 20px; height: 41px; width: 41px; border: none; background: url(/img/more.png); }
.more:hover	{ background-position: -46px 0; }

/* ---------------- static page ----------- */

.page			{ margin: 0; width: 1100px; }
.pagecontainer		{ position: relative; background: #878787; margin: 20px 0 1px 20px; padding: 0 0 10px 0 }
.pagecontainer h1	{ height: 60px; background: #3b3b3b; margin: 0; padding: 8px 0 0 20px; font:40px 'capsuula', sans-serif; }
.pagecontainer p	{ margin: 20px 20px; font: normal 17px Arial, Helvetica, sans-serif; color:#222; line-height: 25px; }
.pagecontainer img	{ float: left; padding-right: 20px; margin-left: 20px }
.pagecontainer h2	{ font: 35px 'capsuula', sans-serif; color:#313131;  padding: 10px 0 0 20px; }

/* ---------------- static page 2 --------- */

.page2			{ margin: 0; width: 1100px; }
.pagecontainer2		{ position: relative; margin: 20px 0 1px 155px; padding: 0 0 10px 0 }
.pagecontainer2 h1	{ height: 60px; margin: 0; padding: 8px 0 20px 20px; font:4.5em 'capsuula', sans-serif; color:#777777; }
.pagecontainer2 p	{ margin: 20px 20px 40px; font: normal 2em 'capsuula', sans-serif; color:#aaaaaa; line-height: 1.5em; }
.pagecontainer2 img	{ float: left; padding-right: 20px; margin-left: 20px }
.pagecontainer2 h2	{ font: 3.5em 'capsuula', sans-serif; color:#777777;  padding: 10px 0 0 20px; }
.pagecontainer2 a	{ border-bottom: 6px #b5eb00 solid; color:#aaaaaa }
.pagecontainer2 a:hover	{ color:#b5eb00 }

ul			{ list-style:none; font: normal 2em 'capsuula', sans-serif; color:#aaaaaa; padding: 0 0 0 0.8em }
ul li			{ background: url(/img/ul.png) no-repeat 0 0.75em; margin: 0; padding: 0.3em 0 0 0.9em }

/* ---------------- footer ---------------- */

#footer				{ position:absolute; bottom: 0; height: 44px; width: 100%; background: #454545; }
#footer	#bottommenu		{ margin-left: 10px }
#footer #bottommenu a		{ float:left; margin: 11px 10px 0 ; font: normal 15px Arial, sans-serif; color:#808080; }
#footer #bottommenu a:hover	{ color:#ff8200; }
#footer a#right			{ position: absolute; right: 0; border: none; display: block; width: 48px; height: 44px; border-left: #4d4d4d 1px solid; }
#footer a#right img		{ position: absolute; right: 10px; bottom: 12px }
#footer a#right:hover		{ background:#555555; }
#footer a>span			{ display: none }

/*-------- glossy devices fetishist's apendix ---------*/

body { -webkit-text-size-adjust: none }
