/*-------------------------------------------------------------------------
=BROWSER RESET
-------------------------------------------------------------------------*/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul, dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object, a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span, strong, sub, sup, tt, var, legend, fieldset, input, textarea { margin:0; padding:0 }
a { outline:none; }
*:active{outline:none}
ol, ul { list-style:none }
table {	border-collapse:separate; border-spacing:0 }
caption, th, td { text-align:left; font-weight:normal }
button, a img, fieldset, input, textarea { border:0 }
textarea { overflow:auto }
address { font-style:normal }
cite { font-style:normal }

/* MAIN */

body{
	background: url(../images/bg.jpg);
}

#header{
	width: 100%; height: auto;
	background: url(../images/mainbg.jpg) repeat-x 0 top;
	position: relative;
	z-index: 900;
	float: left;
	z-index: 900;
}

#content{
	width: 980px; height: 800px;
	background: url(../images/content-bg.png) right center no-repeat;
	float: right;
	padding: 0 55px 0 0;
}

#content h1{
	width: 980px; height: 88px;
	background: url(../images/salaam.png) no-repeat right top;
	text-indent: -9999px;
	font: bold 110px Arial, Helvetica, Geneva, sans-serif;
	color: #FFFFFF;
	margin: 95px 0 0 0;
}

#content a{
	color: #222222;
	text-decoration: none;
}

#content h2{
	width:790px;
	font: 26px Arial, Helvetica, Geneva, sans-serif;
	text-align: right;
	margin: 35px 0 0 0;
	color: #686868;
	float: right;
}

#content p{
	width:790px;
	font: 18px Arial, Helvetica, Geneva, sans-serif;
	text-align: right;
	margin: 35px 0 0 0;
	color: #585858;
	float: right;
}

#twitterbox{
	width: 842px; height: 320px;
	background:url(../images/twitter-bg.png) no-repeat 0 70px;
	position: relative;
	float: right;
}

.button{
	width: 172px; height: 28px;
	margin: 40px 120px 0 400px;
	padding: 12px 0;
	text-align: center;
	background: url(../images/button-bg.png);
	float: right;
}

.button:hover{
	background-position: 0 -52px;
}

.button span{
	font: 22px Arial, Helvetica, Geneva, sans-serif;
	color: #FFFFFF;
}

#content h4{
	width: 842px;
	font: bold 22px Arial, Helvetica, Geneva, sans-serif;
	margin: 43px 0 10px 0;
	color: #31b1dc;
	display: block;
	text-align: right;
	float: right;
}
#content ul{
	width: 548px;
	height: 140px;
	float: right;
}

#content ul li{
	font: 16px Arial, Helvetica, Geneva, sans-serif;
	color: #666;
	text-align: right;
	margin: 0 0 10px 0;
	float: right;
}

#works{
	width: 100%; height: auto;
	margin: -60px 0 0 0;
	position: relative;
	background: url(../images/seperator.png) repeat-x 0 top;
	z-index: 200;
	float: left;
}

#workscontents{
	width: 980px; height: auto;
	padding: 0 55px 0 0;
	float: right;
}

#workscontents .box{
	width: 880px; height: auto;
	margin: 25px 0px;
	position: relative;
	background: url(../images/box-header.png) no-repeat 0 top;
	float: right;
}

#workscontents .box .header{
	width: 100%; height: 200px;
	float: left;
}

#workscontents .box .header h3{
	font: 35px helvetica;
	margin:55px 0 0 40px;
	color: #787878;
	float: left;
}

#workscontents .box .header a{
	width:400px;
	font: 16px helvetica;
	margin: 45px 40px 0 0;
	text-decoration: none;
	text-align: right;
	color: #787878;
	float: right;
}

#workscontents .box .header p{
	width: 500px;
	font: 20px helvetica;
	margin: 5px 40px 0 0;
	text-align: right;
	color: #787878;
	float: right;
}

#workscontents .box .in{
	width: 100%; height: auto;
	padding: 0 0 8px 0;
	background: url(../images/bottom.png) no-repeat 0 bottom;
	float: left;
}


#workscontents .box .in div{
	width: 840px; height: auto;
	padding: 0 20px 20px;
	background: url(../images/center.png) repeat-y;
	float: left;
}

.works-paggination{
	position: relative;
	margin: 40px 0 0 350px;
	float: left;
}

.works-paggination li{
	width: 16px; height: 16px;
	margin: 0 5px 0 0;
	float: left;	
}

.works-paggination li{
	width: 16px; height: 16px;
	font: 16px helvetica;
	color: #FFFFFF;
	text-align: center;
	text-decoration: none;
	background: url(../images/work-pagination.jpg) -16px 0;
}


.works-paggination li a{
	width: 16px; height: 16px;
	text-decoration: none;
	display: block;
}
.works-paggination li a span{
	width: 16px; height: 16px;
	color: #787878;
	display: none;
	margin: -20px 0 0 0;
	float: left;
}

.works-paggination li a:hover span{
	display: block;
}

.works-paggination .active{
	background-position: 0 0;
}

#workscontents .paginationButton{
	margin: 0 250px 0 0;
}

#workscontents .paginationButton .button{
	margin: 0 15px;
	text-decoration: none;
}

#workscontents .box .in div img{
	border: 2px solid #FFFFFF;
	margin: -80px 0 0 0;
	float: left;
}

#works h2{
	width: 842px; height: 48px;
	background: url(../images/works-header.png) no-repeat right top;
	margin: 170px 0 0 0;
	text-indent: -99999px;
	float: right;
}

#contact{
	width: 100%; height: auto;
	margin: -100px 0 0 0;
	background: #6c6b62 url(../images/contacttop.jpg) repeat-x 0 top;
	position: relative;
	z-index: 10;
	float: left;
}

#contact-in{
	width: 980px; height: 650px;
	padding: 150px 0 0 0;
	background: url(../images/contact-bg.png) no-repeat 210px 140px;
	float: right;
}

#contact-in .block{
	width:400px;
	float: left;
}

#block1{
	height: 580px;
	padding: 70px 75px 0 0;
	background: url(../images/line.png) repeat-y right;
}

#block1 h3{
	font: 32px helvetica;
	color: #FFFFFF;
	text-align: right;
	float: right;
}

#block1 p{
	width: 200px;
	font: 13px helvetica;
	margin: 20px 0 0 0;
	color: #FFFFFF;
	text-align: right;
	float: right;
}

#block1 a{
	width: auto;
	font: 13px helvetica;
	color: #FFFFFF;
	margin: 50px 0 0 200px;
	text-decoration: none;
	float: right;
}

#block2{
	margin: 0 30px 0 50px;
	padding: 70px 25px 0 0;
}

#block2 h3{
	width: 100%;
	font: bold 32px helvetica;
	margin: 0 0 10px;
	color: #FFFFFF;
	text-align: left;
	float: right;
}

#block2 label{
	width: 100%;
	display: block;
	margin: 0 0 3px 0;
	font: 24px helvetica;
	color: #FFFFFF;
	font: left;
}

#block2 .largebox{
	width: 100%;
	margin: 5px 0;
	float: left;
}

#block2 .smallbox{
	width: 50%;
	margin: 10px 0;
	float: left;
}

#block2 .smallbox span,#block2 .largebox span{
	display: block;
	padding: 0 10px 0 0;
	background: url(../images/input-bg2.png) no-repeat right;
	float: left;
}

#block2 .smallbox input,#block2 .largebox input{
	background: none;
	padding: 10px;
	font:20px helvetica;
	color: #999999;
	background: url(../images/input-bg.png) no-repeat;
}

#block2 .largebox textarea{
	width: 394px; height: 155px;
	background: none;
	padding: 10px;
	font:20px helvetica;
	color: #999999;
	background: url(../images/textarea-bg.png) no-repeat;
}

#block2 .smallbox  input{
	width: 160px; height: 31px;
}

#block2 .largebox  input{
	width: 360px; height: 31px;
}

.sendButton{
	text-decoration: none;
	margin: 20px 15px 0 0;
}