body {font-family:tahoma; font-size:75%; color:#708d96; background: url("../images/bg/bg.jpg") repeat; line-height:18px}
	body, h1, h2, h3, h4, h5, form, fieldset, img, label, p, span, input {margin:0; padding:0; border:0;}
	a {padding:0px; margin:0px; font:12px tahoma; cursor:pointer; outline: 0; text-decoration:none; color:#658e00}
	a:hover {text-decoration:underline;}

@font-face {font-family: Helvetica; src: url('http://www.ar-com.co.uk/static/fonts/Helvetica.otf');}
h1 {font:20px "Helvetica"; color:#ffffff}
h2 {font:18px "Helvetica"; color:#ffffff}
h3 {font:16px "Helvetica"; color:#ffffff}


#holder {width:100%}
	.home #holder {background: url("../images/bg/home.jpg") no-repeat top center}
	.sub #holder {background: url("../images/bg/sub.jpg") no-repeat top center}
	.portfolio #holder {background: url("../images/bg/portfolio.jpg") no-repeat top center}

	#wrapper {width:960px; margin:0 auto;}

	#header {clear:both; overflow:hidden; height:232px; background: url("../images/bg/header.png") no-repeat top left}
		#header a#logo {float:left; margin:35px 0 0 120px; width:163px; height:75px; background: url("../images/logo.png") no-repeat; text-indent:-9999em;}
		#header ul {float: right; padding: 10px 10px 0 0; margin:0px; clear: right;}
		#header ul li {float: left; padding: 0 0 0 3px; margin:0; list-style:none; position:relative; z-index:98}
		#header ul a {float: left; position:relative; width:41px; height:41px; background: url("../images/icons/lang.png") no-repeat 0 0; z-index:98; text-indent:-9999em;}
		#header .pl a { background-position:0 0}
		#header .en a { background-position:-41px 0}
		#header .pl a:hover, #header .pl a.active { background-position:0 -41px}
		#header .en a:hover, #header .en a.active { background-position:-41px -41px}
		#header a.twitter  {display:block; height:54px; position:fixed; top:50px; right:50px; width:51px; text-indent:-9999em; -moz-background-clip:border; -moz-background-inline-policy:continuous; -moz-background-origin:padding; background:transparent url("../images/icons/twitter.png") repeat scroll 0 0; z-index:5000}

	#main {clear:both}
	
		#left {float:left; width:240px; padding:0 0 50px 0}
		#right {float:right; width:620px; padding:0 60px 25px 0}
		.leftcol {float:left; width:300px}
		.rightcol {float:right; width:300px}
		
		#left ul {padding:50px 0 45px 60px; margin:0}
			#left ul li {display:block; clear:both; overflow:hidden; padding:5px 0 6px 5px; margin:0; list-style:none; width:175px; background: url("../images/linex.jpg") repeat-x bottom left}
			#main #left ul li a {float:left; padding:4px 0 0 37px; background: url("../images/icons/menu.png") no-repeat 0 0; width:auto; height:22px;}
			#main #left ul li a:hover { background-position:0 -26px}
			#left span {display:block; width:71px; height:20px; background: url("../images/bg/menu.png") no-repeat; text-indent:-9999em;}
			#left li.tab1 span {background-position:0 0}
			#left li.tab2 span {background-position:0 -20px}
			#left li.tab3 span {background-position:0 -40px}
			#left li.tab4 span {background-position:0 -60px}
			#left ul li.tab4 {background:none}
			#main .pl li.tab3 span {background-position:0 -80px}
			#main .pl li.tab4 span {background-position:0 -100px}
			#left a {display:block; width:162px; height:162px; background: url("../images/bg/contact.png") no-repeat; text-indent:-9999em;}
			#left a {background-position:0 0}
			#main .pl a {background-position:0 -162px}		

		#slideshow {display:block; position:relative; float:right; padding:0; margin:-232px 0 0 0; width:570px; height:480px; outline: none;}
			#slideshow p {float:right; padding:50px 50px 0 0; color:#ffffff; line-height:30px; font-weight:bold}
			#slideshow p a {display:block; clear:both; overflow:hidden}
			.portfolio #slideshow {margin:-187px 0 10px 0; width:560px; height:570px;}

		#banner {float:right; display:block; padding:0; margin:-232px 0 0 0; width:400px; height:340px; z-index:0}
		#block {clear:both; padding:25px 0 0 0}
		cite {float:left; margin:-40px 0 0 0; padding:0; width:250px; height:182px; background: url("../images/bg/psd-xhtml-css.png") no-repeat; text-indent:-9999em;}
		blockquote {float:right; padding:10px 10px 15px 20px; margin:0; width:291px; height:117px; background: url("../images/bg/box.png") no-repeat;}

		#content {clear:both; padding:25px 0 0 0}
			#content h1, #content h2, #content h3, #content p, #block h1 {display:block; padding:0 0 10px 0}
			#content ul {display:block; padding:0 0 10px 0; margin:0}
			#content ul li {display:block; padding:0 0 5px 15px; margin:0; background: url("../images/dot-green.gif") no-repeat 0 8px; list-style:none}
			#content strong {color:#ffffff; font-weight:normal}

			#content a.btn {float: right; margin:0 10px 0 0; display:block; padding:5px 0 0 0; position:relative; width:61px; height:22px; background: url("../images/btn.png") no-repeat 0 0; color:#FFFFFF; text-align:center; font:bold 12px tahoma}
			#content a.btn:hover {background-position:0px -27px; text-decoration:none}

		#right .sitemap ul {padding:0 0 20px 0; margin:0; clear:both; overflow:hidden}
			#right .sitemap ul li {display:block; padding:0 0 15px 25px; list-style:none; background: url("../images/bullet-yellow.png") no-repeat 0px 3px; color:#e6e6e6; clear:both; overflow:hidden}
			* html #right .sitemap ul li {background: url("../images/bullet-yellow.gif") no-repeat 0px 3px;}
			#right .sitemap ul ul {padding:10px 0 0 0}
			* html #right .sitemap ul ul {padding:0 0 0 25px}
			#right .sitemap ul ul li {display:block; padding:0 0 10px 20px; margin:0; background: url("../images/dot-green.gif") no-repeat 0 7px; list-style:none}
			#right .sitemap em {display:block;  width:100%;  color:#ffffff; font-style:normal}

		#content .contact {float: left; position:relative; margin:-95px 15px 0 -30px; padding:0px; clear:left; width:392px; height:392px; background: url("../images/bg/circle-contact.png") no-repeat top left; z-index:10}
			#content .contact ul {display:block; padding:129px 0 0 120px; margin:0} 
			#content .contact ul li {display:block; padding:0 0 20px 0; list-style:none; background:none; width:250px; clear:both}
			* html #content .contact ul li {float:none}
			#content .contact a {display:block; width:191px; height:20px; position:relative; background: url("../images/bg/details.png") no-repeat; text-indent:-9999em; z-index:100;}
			#content .contact a.email {background-position:0 0}
			#content .contact a.skype {background-position:0 -20px}
			#content .contact a.gg {background-position:0 -40px}
			#content .contact span {display:block; margin:20px 0 0 0; width:139px; height:48px; background: url("../images/location.png") no-repeat; text-indent:-9999em}

			.portfolio #content {margin:-50px 0 0 0; padding-bottom:50px; float:left; width:620px}

		form {float:right; padding:0; margin:0; width:240px;}
			label {display:block; padding:0 0 5px 8px; margin:0; width:240px;}
			label.error {color:#CE1017; padding:0 0 5px 8px; margin:-5px 0 0 0; display:block; clear:both; overflow:hidden; width:220px;}
			input {padding: 3px 0px; color:#ffffff; background:none; width: 215px; margin: 0px; font: 12px tahoma; border:0px; position:relative; z-index:100}
			textarea {padding: 2px 5px 3px 0; color:#ffffff; background: none; width: 220px; margin: 0px; font: 12px tahoma; border:0px; position:relative; z-index:100; overflow:auto; /*overflow-x: hidden; overflow-y: scroll;*/ height:95px}
			#content form div {display:block; float:left; width:240px; clear:both; overflow:hidden; padding:0; margin:0; height:auto; background:none}
			#content form div span {float:none; display:block; padding:4px 0 5px 8px; margin:0 0 5px 0; width:232px; height:27px; background: url("../images/form-input.png") no-repeat;}
			#content form div span.info {height:111px; background: url("../images/form-textarea.png") no-repeat;}
			#content form p {display:block; padding:15px 0 0 0; clear:both; overflow:hidden}
			#content form a.btn {margin:0}
			#content fieldset {width:240px; padding:0; margin:0; border:0px}

	#footer {clear:both; overflow:hidden; padding:0 60px 30px 60px}
		#footer ul {display:block; padding:0px; margin:0; width:840px}
		#footer ul li {float: left; padding:5px 10px 0 10px; margin:0; list-style:none; height:22px}
		#footer ul li.left {width:400px}
		#footer ul li.left, #footer ul li.right {background:#132D36}
		#footer ul li.right {float:right}
		#footer ul li.right a {margin:0}
		#footer a {display:inline-block; margin:0 50px 0 0}
		#footer a.gg {margin:0}
		#footer div {width:170px; text-align:center}
		#footer div a {margin:0 2px}

	.heading {float:left; overflow:hidden; clear:both; text-align:justify; padding:0; margin:0 auto; width:620px; min-height:0px; height:0px; line-height:0px; color: #007DBD; border:0px;}
		.heading h3 {color: #BAD72E; display:block; padding:0 0 10px 0; margin:0; font:16px tahoma;}

	/*-- lightbox  --*/
	#lightbox {background-color:#eee; padding: 10px; border-bottom: 2px solid #666; border-right: 2px solid #666}
		#lightboxDetails {font-size: 0.8em; padding-top: 0.4em;}	
		#lightboxCaption { float: left;}
		#keyboardMsg{float: right; }
		#closeButton{ top: 5px; right: 5px; }
		#lightbox img{ border: none; clear: both;} 
		#overlay img{ border: none; }
		#overlay { background-image: url("../images/lightbox/overlay.png"); }

	#scroll {float:right; position:relative; overflow:hidden; height: 350px; width:400px;}
		#scroll #pages {position:absolute; height:20000em;}
		#scroll	.page {padding:0; height: 350px; width:400px;}
		#scroll .scrollable {position:relative; overflow:hidden; width: 400px; height: 350px;}
		#scroll .scrollable .items {width:20000em; position:absolute; clear:both;}
		#scroll .item {float:left; cursor:pointer; width:400px; height:345px; padding:5px 0 0 0;}
		
		#content ul#navi {float:left; padding:0px !important; margin:0px !important; width:210px;}
		#content ul#navi li {float:left; padding:5px 0 0 35px; clear:both; height:50px; width:175px; cursor:pointer; background:url("../images/dot-green.png") no-repeat 0 0}
		#content ul#navi li:hover, #content ul#navi li.active {background:url("../images/dot-orange.png") no-repeat 0 0}
		#content ul#navi strong {display:block;}
		
		#scroll div.navi {cursor:pointer; clear:both; padding:10px 0 15px 0; margin:0; overflow:hidden; display:block; text-align:right}
		#scroll div.navi a.active {background-position:0 -16px}
		#scroll div.navi a {display: inline-block; background:url("../images/navigator.png") no-repeat scroll 0 0 transparent; font-size:1px; height:8px; margin:3px; width:8px;}

	#pane {display:block; clear:both; overflow:hidden; width:620px}
		#tabs {display:block; float:left; clear:both; overflow:hidden; padding:0 0 20px 0; width:620px}
		#tabs img { float:left; margin:0; cursor:pointer}
		#tabs img.righttab {float:right}
		#pane .description {display:block; float:left; clear:both; padding:0 20px; width:580px; min-height:200px; display:none; margin-top:17px; background:#10262e}
		#pane .description .arrow {position:relative; margin:-30px 0 20px 80px; width:60px; height:30px; background:url("../images/arrow-up.png") repeat 0 0; font-size:1px;	}
		#pane .description ul {float:left; width:270px}
		#pane .two .arrow {margin-left:440px;}
		* html #tabs {float:none}
		* html .description {float:none}

	.sline {float:left; overflow:hidden; clear:both; text-align:justify; padding:0; margin:0 auto; width:620px; min-height:0px; height:0px; line-height:0px; color: #007DBD; border:0px;}
		.sline strong {color: #BAD72E; display:block; padding:0 0 10px 0; margin:0; font-size:130%}

	.jScrollPaneContainer {position: relative;	overflow: hidden; z-index: 1; outline:0}
	.jScrollPaneTrack {position: absolute; cursor: pointer; right: 0; top: 0; background: #132D36 }
	.jScrollPaneDrag {position: absolute; background: url("../images/scrollbar.jpg") no-repeat 0 0; cursor: pointer; overflow: hidden; height:30px !important}
	.jScrollPaneDragTop {position: absolute; top: 0; left: 0; overflow: hidden;}
	.jScrollPaneDragBottom {position: absolute; bottom: 0; left: 0; overflow: hidden;}
	a.jScrollArrowUp {display: block;position: absolute; z-index: 1; top: 0; right: 0; text-indent: -2000px; overflow: hidden; height: 9px;}
	a.jScrollArrowUp:hover {/*background-color: #f60;*/}
	a.jScrollArrowDown {display: block;	position: absolute;	z-index: 1; bottom: 0; right: 0; text-indent: -2000px; overflow: hidden; /*background-color: #666;*/ height: 9px;}
	a.jScrollArrowDown:hover {/*background-color: #f60;*/}
	a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}

	div.tags {display:block; width:840px; margin:0; padding:0 60px 50px 60px; clear:both; overflow:hidden; position:relative}
		div.tags #pane {width: 840px; height: 70px; overflow: auto; float: left; background:none; outline:0}
		div.tags h3 {display:block; padding:0 0 10px 0; font:bold 14px/18px tahoma; color:#57727a}
		div.tags h6 {display:block; clear:both; overflow:hidden; padding:0 0 10px 0; margin:0; font:11px/14px tahoma; color:#57727a} 
		div.tags h6 strong {display:block}
		div.tags h6 a {font:11px tahoma; color:#57727a}
		div.tags p {display:block; padding:0 0 10px 0; font:11px/14px tahoma; color:#57727a; vertical-align: text-top;}
		div.tags p a {font:11px tahoma; color:#57727a}
		div.tags ul, div.tags li {font:11px/14px tahoma; color:#57727a}
		div.tags table {border:0; font:11px/14px tahoma; color:#57727a}
		div.tags table td {border:0; font:11px/14px tahoma; color:#57727a}