/* ------------ page globals --------------------- */
body	{
	margin: 0; padding: 0;
	color: #FFFFFF;
	text-shadow: 0 0 0 #000000; color: #FFFFFF;
	background: #000000;
	font: 62.5% Tahoma, sans-serif;
}

/* ------------ defaults --------------------- */
html, body		{width: 100%; height: 100%; overflow: hidden;}
ul, ol, li		{margin: 0; padding: 0; list-style-type: none;}
ul ul	{margin-left: 2em;}
img				{border: 0;}
* table, * td	{border-collapse: collapse; padding: 0;}

a	{color: #FFFFFF;}
p, li, h1, h2, h3, ul, ol, li	{margin: 0; padding: 0;}


/* ------------ useful --------------------- */
.clear		{clear: both; height: 1px;}
.nowrap		{white-space: nowrap;}
.visible	{display: block !important;}
.hidden		{display: none !important;}
.listMark	{position: absolute; display: block; float: left; margin-left: -1.2em; width: 0; overflow: visible; text-align: right; line-height: 1.2em;}
.num span	{padding-right: 0.2em; white-space: nowrap;}
.inline		{display: inline !important;}



/* ---------- footer & header---------- */
.footer, .header	{position: absolute; text-align: center; font-size: 1.2em; text-transform: uppercase; z-index: 100; width: 100%;}
.header	{margin: 10px 0 0 0; left: 0; font-size: 1.4em;}
.footer	{bottom: 30px;}

/* --------- arrows ----------- */
#leftArrow, #rightArrow	{position: absolute; height: 100%; width: 150px; z-index: 100; cursor: pointer; cursor: hand;}
#leftArrow	{left: 0; background: #202020 url('/images/left.gif') no-repeat 50% 50%;}
#leftArrow.active	{background-image: url('/images/left-s.gif');}
#rightArrow	{right: 0; background: #202020 url('/images/right.gif') no-repeat 50% 50%;}
#rightArrow.active	{background-image: url('/images/right-s.gif');}
.invisible	{display: none;}

/* ---------- fixed ------------ */
.scroll	{overflow: auto; width: 100%; position: absolute; z-index: 50; height: 100%;}

/* -------- contextFrames ------------ */
.frames	{margin: 0; padding: 0 0 0 300px; height: 610px; overflow: hidden; position: relative; z-index: 50;}
.frame	{height: 610px; height: 100%; float: left; padding-left: 90px;}
.frame.mouseOver	{cursor: pointer; cursor: hand;}

/* --------------- layout -------------- */
.text h1, .text h2	{font-size: 2em; font-weight: normal; margin: 0 0 1em 0;}
.text p	{font-size: 1.3em; line-height: 1.4em; margin: 0 0 1.4em 0;}
.text p.beforeList	{margin-bottom: 1em;}
.text ul	{margin: 0 0 2em 0;}
.text li	{font-size: 1.3em; margin: 0 0 0.5em 1em;}

.about .cols	{padding: 135px 10px 0 0;}
.whoWeAre	{padding: 135px 0 0 0; width: 30em; position: relative; right: -650px;}
.contact	{padding: 135px 40px 0 80px; width: 30em;}
.swarovski .cols	{padding: 190px 60px 0 0;}
.rubicsCube	{position: relative; left: -320px;}
.frame.blog	{padding: 155px 0 0 0; position: absolute; left: 50px; width: 200px;}
.frame.blog h2	{margin: 0; font-weight: normal; font-size: 1.6em;}
.frame.blog ul	{margin: 0; padding: 1em 0 0 0;}
.frame.blog li	{margin: 0; padding: 0 0 0.5em 0; font-size: 1.2em; line-height: 1.4em;}

.cols	{width: 50em;}
.col	{width: 21em; padding: 0 3.9em 0 0; float: left;}

.work .about	{margin: 95px 0 0 0; padding: 4px; position: absolute; width: 30em;}
.work .about .full	{display: none; margin-top: 10px; text-transform: none;}
.work .about.full	{background: #000000;}
.work .about.full .full	{display: block;}
.work	{font-size: 1.1em; text-transform: uppercase; color: #909090;}

.rubicsCube img	{margin: 143px 115px 0 25px;}
.glasses	{margin: 0 0 0 100px;}
.glasses img	{margin: 170px 100px 0 24px;}
.dog img	{margin: 197px 72px 0 22px;}
.moleskine img	{margin: 40px 50px 0 15px;}
.iRiver img	{margin: 0 85px 0 35px;}

.back	{float: none; position: absolute; width: 100%; text-align: center; right: 0; left: 0; top: 0;}

.price .padding	{width: 20em; padding: 135px 40px 0 50px; margin-top: 4em;}
.price img	{position: relative; float: left; margin-left: -33px;}
.price p	{float: left; width: 15em; font-size: 1.2em;}