body {
	background-image:url('/images/bg.jpg');
	background-repeat: repeat;
	background-color: #2B2F32;
	font-family: helvetica, arial, sans-serif;
	color: #FFF;
	font-size: 10pt;
}

a {
	color: #66BEFA;
	outline: none;
}

a:hover {
	color: #FFF;
	text-decoration: underline;
}

#root {
	width: 980px;
	margin: 0 auto;
	margin-top: 30px;
}

#header {
	width: 980px;
	height: 71px;
	background-image:url('/images/header.png');	
}

#center {
	width: 980px;
	height: 541px;
	background-image:url('/images/bgc.png');
}

#footer {
	width: 980px;
	height: 53px;
	background-image:url('/images/footer.png');	
}

#logo {
	position: absolute;
	margin-top: 9px;
	margin-left: 10px;
	width: 170px;
	height: 61px;
}

#logo a {
  display: block;
  width: 170px;
  height: 61px;
  background: transparent url('/images/logo.png') top left no-repeat;
	outline: none;
}

#logo a:hover {
  background-position: -170px 0%;
}

a span {
	display: none;
}

#menu {
	position: absolute;
	margin-top: 8px;
	margin-left: 652px;
	width: 319px;
	height: 86px;
}

#menu ul, #menu li {
list-style-type: none;
margin:0;
padding:0;
}

#menu ul {
background: transparent url(/images/menu.png) top left no-repeat;
width: 319px;
height: 86px;
}

#menu li {float: left;}
 
#menu li a {
display: block;
height: 86px;
width: 106px;
outline: none;
}

#menu li a:hover {
background: transparent url(/images/menu.png) top left no-repeat;
}

#menu li a#ios:hover {
background-position: -319px 0%;
}
#menu li a#web:hover {
background-position: -425px 0%;
}
#menu li a#social:hover {
background-position: -531px 0%;
}

#company {
	position: absolute;
	margin-top: 3px;
	margin-left: 15px;
	width: 170px;
	height: 61px;
}

#company a {
  display: block;
  width: 42px;
  height: 35px;
  background: transparent url('/images/company.png') top left no-repeat;
}

#company a:hover {
  background-position: -42px 0%;
}

#contact {
	position: absolute;
	margin-top: 2px;
	margin-left: 927px;
	width: 170px;
	height: 61px;
}

#contact a {
  display: block;
  width: 38px;
  height: 35px;
  background: transparent url('/images/contact.png') top left no-repeat;
}

#contact a:hover {
  background-position: -38px 0%;
}

#facebook {
	position: absolute;
	margin-top: 3px;
	margin-left: 70px;
	width: 32px;
	height: 33px;
}

#facebook a {
  display: block;
  width: 32px;
  height: 33px;
  background: transparent url('/images/facebook.png') top left no-repeat;
}

#facebook a:hover {
  background-position: -32px 0%;
}

#twitter {
	position: absolute;
	margin-top: 3px;
	margin-left: 105px;
	width: 33px;
	height: 33px;
}

#twitter a {
  display: block;
  width: 33px;
  height: 33px;
  background: transparent url('/images/twitter.png') top left no-repeat;
}

#twitter a:hover {
  background-position: -33px 0%;
}

/* home */
#dock {
	width: 324px;
	height: 541px;
	margin-left: 10px;
	float: left;
	background-image: url('/images/dock.png');
}

#dock #iphone {
	position: absolute;
	margin-left: 10px;
	margin-top: 25px;
	width: 300px;
	height: 475px;
	background-image: url('/images/iphone.png');
}

#intro {
	float: right;
	width: 560px;
	height: 390px;
	margin-right: 55px;
	margin-top: 40px;
}

#intro h1 {
	color: #66BEFA;
	font-size: 18pt;
	text-shadow: 2px 2px 2px #131313;
	margin-bottom: 30px;
}

#intro h2 {
	color: #FFF;
	font-size: 14pt;
	text-shadow: 2px 2px 2px #131313;
	margin-top: 15px;
	margin-bottom: 30px;	
}

#intro h3 {
	color: #FFF;
	font-size: 10pt;
	text-shadow: 2px 2px 2px #131313;
	margin-bottom: 10px;
	display: inline;
}

#intro #mobile {
	position: absolute;
	width: 180px;
	height: 110px;
}

#intro #web {
	position: absolute;
	margin-left: 196px;	
	width: 180px;
	height: 110px;
}

#intro #network {
	position: absolute;
	margin-left: 392px;	
	width: 180px;
	height: 110px;
}

#intro .pic {
	width: 30px;
	float: left;
}

#intro .desc {
	width: 130px;
	float: right;
}

/* portfolio */
#pad {
	width: 172px;
	height: 541px;
	margin-left: 10px;
	float: left;
	background-image: url('/images/pad.png');
}

#content {
	float: left;
	width: 750px;
	height: 500px;
	margin-top: 20px;
	margin-left: 20px;
	z-index: 99;	
}

#content2 {
	width: 750px;
	height: 500px;
	float: left;
	margin-left: 25px;
	margin-top: 10px;
	z-index: 99;
}

h1.project {
	color: #66BEFA;
	font-size: 16pt;
	text-shadow: 2px 2px 2px #131313;
	margin-bottom: 30px;
	width: 240px;
}

h2.project {
	color: #66BEFA;
	font-size: 14pt;
	text-shadow: 2px 2px 2px #131313;
	margin-bottom: 30px;
	width: 240px;
}

#content #iphone {
	position: absolute;
	margin-left: 230px;
	top: 42px;
	width: 300px;
	height: 475px;
	background-image: url('/images/iphone.png');
}

#content_left {
	position: absolute;
	top: 120px;
	left: 0px;	
	width: 290px;
}

#content_right {
	position: absolute;
	top: 120px;
	left: 550px;
	width: 200px;
}

#country {
	position: absolute;
	top: 20px;
	left: 530px;
	width: 200px;
	height: 30px;
	text-align: center;
}

#go {
	position: absolute;
	top: 435px;
	left: 570px;
	width: 200px;
	height: 30px;
}

#gourl {
	position: absolute;
	top: 480px;
	left: 550px;
	width: 200px;
	height: 30px;
}

#glare {
	position: absolute;
	left: 169px;
	top: 77px;
	width: 75px;
	height: 229px;
	background-image: url('/images/glare.png');
	z-index: 99;
}

#slider-project {
    position:absolute;
		margin-left: 61px;
		margin-top: 77px;
    width:183px;
    height:275px;
    background:url(/images/loading.gif) no-repeat 50% 50%;
}
#slider-project img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider-project a {
    border:0;
    display:block;
}

#project-name {
	position: absolute;
	text-align: center;
	margin-left: 230px;
	top: 500px;
	width: 300px;
	font-weight: bold;
	text-shadow: 2px 2px 2px #131313;
	z-index: 1;
}

#slider-web {
    position:absolute;
		margin-left: 0px;
		margin-top: 32px;
    width: 640px;
    height:328px;
}
#slider-web img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider-web a {
    border:0;
    display:block;
}

h1 {
	color: #66BEFA;
	font-size: 16pt;
	text-shadow: 2px 2px 2px #131313;
	margin-bottom: 0px;
}

#leftmenu {
	width: 171px;
	height: 541px;
	overflow: auto;	
}

#leftmenu ul, #leftmenu li {
list-style-type: none;
margin:0;
padding:0;
}

#leftmenu ul {
width: 171px;
}

#leftmenu li {float: left;}
 
#leftmenu li a {
	display: block;
	height: 36px;
	width: 171px;
	color: #5f5f50;
	text-decoration: none;
	font-size: 10pt;
	text-shadow: 1px 1px 1px #fcfcfb;	
	line-height: 36px;
	background: transparent url(/images/item.png) top left no-repeat;
	outline: none;	
}

#leftmenu li a.first {
	background: transparent url(/images/itemFirst.png) top left no-repeat;	
	outline: none;	
}

#leftmenu li a span {
	margin-left: 20px;
	display: inline;
	outline: none;
}

#leftmenu li a:hover {
	background-position: -171px 0%;
	color: #fcfcfb;
	text-shadow: 1px 1px 1px #000;	
}

#leftmenu li.current a {
	background-position: -171px 0%;	
	color: #fcfcfb;
	text-shadow: 1px 1px 1px #000;
}

#project {
	position: absolute;
	margin-left: 182px;
	width: 788px;
	height: 541px;
	background-image: url('/images/project.png');	
}

#project #content {
	width: 750px;
}

#slider-home {
    position:absolute;
		margin-left: 61px;
		margin-top: 77px;
    width:183px;
    height:275px;
    background:url(/images/loading.gif) no-repeat 50% 50%;
}
#slider-home img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider-home a {
    border:0;
    display:block;
}

#project-title {
	position: absolute;
	text-align: center;
	margin-left: 12px;
	top: 590px;
	width: 300px;
	font-weight: bold;
	text-shadow: 2px 2px 2px #131313;
}

#content-page {
	position: absolute;
	width: 920px;
	height: 500px;
	margin-left: 30px;
	margin-top: 20px;
}

a.btn_small {
  display: block;
  width: 84px;
  height: 28px;
  background: transparent url('/images/btnsmall.png') top left no-repeat;
	color: #FFF;
	text-shadow: 1px 1px 1px #245F88;
	text-decoration: none;
	line-height: 28px;
	text-align: center;
	font-weight: bold;
}

a.btn_small:hover {
  background-position: -84px 0%;
}

a.btn_big {
  display: block;
  width: 168px;
  height: 28px;
  background: transparent url('/images/btnbig.png') top left no-repeat;
	color: #FFF;
	text-shadow: 1px 1px 1px #245F88;
	text-decoration: none;
	line-height: 28px;
	text-align: center;
	font-weight: bold;
}

a.btn_big:hover {
  background-position: -168px 0%;
}

#picto {
	position: absolute;
	margin-left: 765px;
	top: 353px;
	width: 168px;
	height: 164px;
	background-image: url('/images/picto.png');
}

#picto2 {
	position: absolute;
	margin-left: 795px;
	top: 475px;
	width: 168px;
	height: 164px;
	background-image: url('/images/picto.png');
}

#safari {
	position: absolute;
	top: 80px;
	left: 75px;
	width: 640px;
	height: 361px;
	background-image: url('/images/safari.png');
}

#web_content {
	position: absolute;
	top: 442px;
	left: 75px;	
	width: 430px;
	height: 60px;
}

#web_url {
	position: absolute;
	top: 17px;
	left: 70px;	
	width: 300px;
	height: 20px;
	color: #000;
	font-size: 9px;
}

#web_name {
	position: absolute;
	top: 1px;
	left: 40px;	
	width: 580px;
	height: 12px;
	color: #000;
	font-size: 12px;	
	text-align: center;
	font-weight: bold;
}

img {
	border: 0px;
}

#box {
	position: absolute;
	top: 50px;
	left: 640px;
	width: 268px;
	height: 153px;
	background-image:url('/images/box.png');
}

#box_content {
	padding: 10px;
	text-shadow: 1px 1px 1px #131313;	
}

.clear{
	clear:both;
}


/* Contact */

.formRow {

clear: both;
	margin-bottom: 5px;
}

.formRow label {
	width: 190px;
	text-align: left;
}

.formRow input{
	background:transparent url(/images/textfield.png) no-repeat left bottom;
	width: 387px;
	height: 35px;
	padding-left: 10px;
	border: 0px;
	color: #868686;
	font-size: 11pt;
	font-style: italic;
	line-height: 35px;
	font-family: helvetica, arial, sans-serif;	
}

.formRow input:focus{
	background:transparent url(/images/textfield_focus.png) no-repeat left bottom;
	outline: none;
}

.formRow textarea{
	background:transparent url(/images/textarea.png) no-repeat left top;
	width: 377px;
	height: 164px;
	border: 0px;
	font-size: 11pt;
	font-style: italic;
	color: #868686;	
	outline: none;
	font-family: helvetica, arial, sans-serif;
	padding: 5px 0px 0px 10px;	
	overflow:auto;	
}

.formRow textarea:focus{
	background:transparent url(/images/textarea_focus.png) no-repeat left top;
}

.contact_btn {
	margin-left: 305px;
}

#text-content {
	width: 550px;
	text-align: justify;
}

#langs {
	position: absolute;
	margin-top: 34px;
	margin-left: 230px;
	width: 50px;
	font-size: 12px;
	color: #272727;
}

#langs a {
	color: #272727;;
}

#langs a:hover {
	color :#FFF;
}

#contacts {
	position: absolute;
	margin-left: 100px;
	top: 540px;
	width: 450px;
	height: 20px;
	text-align: right;
}

.desc a {
	text-decoration: none;
}
