/* ALLG
------------------------------------------------------------------------------*/

*{
  outline:none;
  line-height:1.5em;
  font-size:12px;
  font-family: Trebuchet MS, Helvetica, Arial, sans-serif;
  color:#FFF;
}

body{
  margin:0;
  padding:0;
  text-align:center;
  background:#000;
}

img{
  border:0;
}

.clear{
  clear:both;
  line-height:0;
  font-size:0;
}


/* CONTAINER
------------------------------------------------------------------------------*/

#container{
  width:800px;
  margin:0 auto;
  text-align:left;
}

#line{
  width:100%;
  height:10px;
  background:#000;
}

#header{
  height:80px;
}

#header a{
  width:150px;
  height:23px;
  display:block;
  position:absolute;
  top:50px;
}

#claim{
  height:70px;
  display:block;
  position:absolute;
  top:100px;
}

#easyTooltip {
  padding: 5px 7px;
  background: #000;
  color:#FFF;
  font-size:12px;
  z-index: 999;
}

#counter{
  position: absolute;
  left:-2000px;
}


/* PROJECTS / CONTACT
------------------------------------------------------------------------------*/

#projects{
  height:350px;
  width:800px;
  z-index:1;
  display:block;
  position:absolute;
  top:220px;
}



#projects .content,
#contact .content{
  height:310px;
  width:760px;
  z-index:99;
  position:absolute;
  top:0px;
  padding:20px;
  z-index: 99;
}

#projects .content h1,
#contact .content h1{
  font-size:14px;
  margin:5px 0 10px 0;
  padding:0;
  text-transform: uppercase;
}
#projects .content h1 span,
#contact .content h1 span{
  font-size:14px;
  color:#AAA;
  display:block;
  font-weight:normal;
  text-transform: none;
}

#projects .content h2,
#contact .content h2{
  font-size:12px;
  margin:15px 0 5px 0;
  padding:0;
}


#projects .content p{
  font-size:11px;
  margin:5px 0;
  padding:0;
}

#projects .content .screenshot{
  padding:15px 20px;
  width:350px;
  height:280px;
  float:left;
}
#projects .content .infos{
  padding:15px 20px;
  width:270px;
  height:280px;
  float:left;
  color:#FFF;
}

#projects .content .infos .link{
  margin:10px 0;
  color:#78b5b7;
  line-height:1.4em;
}

#projects .content a,
#contact .content a,
#respect .content a{
  color:#78b5b7;
  text-decoration:none;
}

#projects .content a:hover,
#contact .content a:hover,
#respect .content a:hover{
  color:#FFF;
  text-decoration:none;
}

/* CONTACT
------------------------------------------------------------------------------*/

#contact{
  height:590px;
  width:500px;
  z-index:1;
  display:block;
  position:absolute;
  top:590px;
}

#contact .content{
  height:500px;
  width:430px;
  z-index:99;
  position:absolute;
  top:0px;
  padding:20px;
  z-index: 99;
}

#contact .content p{
  width:420px;
}


/* RESPECT
------------------------------------------------------------------------------*/

#respect{
  height:590px;
  width:350px;
  z-index:1;
  display:block;
  position:absolute;
  top:590px;
  margin-left:490px;
}

#respect .content{
  height:300px;
  width:270px;
  z-index:99;
  position:absolute;
  top:0px;
  padding:20px;
  z-index: 99;
}

#respect .content .respect{
  clear:both;
  margin:15px 0;
}
#respect .content .respect .link{
  width:110px;
  float:left;
  margin-bottom:7px;
}




/* SLIDESHOW
------------------------------------------------------------------------------*/

#slideshow #slidesContainer {
  margin:0 auto;
  width:700px;
  height:295px;
  overflow:auto; /* allow scrollbar */
  position:relative;
}

#slideshow #slidesContainer .slide {
  margin:0 auto;
  width:700px;
  height:295px;
}

.control {
  display:block;
  width:40px;
  height:350px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
  left:0;
  background:transparent url(../images/layout/arr_left.png) no-repeat 20px 50%;
}
#rightControl {
  top:0;
  right:0;
  background:transparent url(../images/layout/arr_right.png) no-repeat 0 50%;
}