
/*
@charset 'utf-8';

 Jan Hille 1.0 ENCODING UTF-8
// 
/* Basics GUI
------------------------------ */
/*  
 *      File: basis.css
 *      Abstract: CSS properties for Jan Hille
 *      Version: 1.0
 *      © 2010 Marc Wright, Team-Tejat Hamburg 2009 http://www.tejat.de	
 */  
 
body{ font-family: 'Courier New', Courier, monospace;  font-size: 100%; padding:0; margin: 0 }
a { outline: none; } 
a {text-decoration: none; color: #000;}
a:visited {color: #000;}
a:hover {color: red;}

/* structure */
#parent{
  width:810px;
  margin-left: auto;
  margin-right: auto;
  visibility: hidden;
  height: 320px;
}

#navigation{
  display: block;
}

#logo{
  position: relative;
  top: -8px;
  padding: 0;
  margin: 0;
}

/* em can scale */
#logo img{
  width: 32em;
  left: -3.5em;
  position: relative;
}


/* position of container */
#image_container{
  margin-top: 10px;
  padding: 0;
  width: 810px;
  height: 250px;
  overflow: auto;
}

#loading{
  position: absolute;
  top: 46%;
  width: 99%;
  height: 30px;
  background-image: url(../art/loader.gif);
  background-position: center center;
  background-repeat: no-repeat;
  
}
.arrow{
  font: 11px 'Courier New', Courier, monospace;
  position: relative;
  display: inline;
  top: -202px;
  display: none;
  font-size-adjust:0.45;
  
}
.back{
  left: -30px;
  }

.forward{
  left: 806px;
  }

#inner_images{
  padding: 0;
  margin: 0;
  height: 140px;
  width: 10000px;
  overflow: hidden;
  visibility: hidden;
  position: relative
}
/* navigation UL styles  main NAVIGATION top */
#ul_projects, #ul_communicate{
   font: 12px 'Courier New', Courier, monospace;
   text-transform: lowercase;
}

#ul_projects{
  display: block;
  padding:0;
  margin:0;
  }
#ul_communicate{
  padding:0;
  margin:0;
  float:right; 
  display: block;
  position: relative;
  top: -14px;
  padding-right: 7px;
  
}

.project_li{
  display: inline;
  margin:0;
  padding:0;
  list-style: none;
  
}

.project_right{
  display: inline;
  list-style: none;
}


.bold a{
  color: #999;
}


/* images (thumbs) li's ' */
li.media{
  width: 128px;
  height: 96px;
  float: left;
  margin-right: 5px;
  background-color: #ededed;
  border: 1px solid #fff;
}

/* padded empty li items*/
.empty{
  background-color: #fff !important;
  border: 1px solid #fff !important;
  background-image: none !important;
}

/*separate image */
.separate{
  position: relative; margin-bottom: -3px
}

#image_container img{
  position: relative;
  width: 126px;
  opacity: 0.9;
  -moz-opacity: 0.9;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  /*display: none;*/
  border: 1px solid #fff;
  color:#fff; 
}


/* mouseOver effect */
#image_container a img:hover{
  opacity: 1;
  -moz-opacity: 1;
  border: 1px solid #fff;
  -moz-box-shadow: 0 0 4px #294460;
  -webkit-box-shadow: 0 0 4px #294460;
}

/* ul that holds images */
#projects{
  list-style-type: none;
  padding: 0;
  margin:0;
}

/* <li> class */
.inner_projects{
  list-style-type: none;
  padding: 0;
  margin-right: 6px;
}

/* first movie */
.skew{
  position: relative;
  display: block;
  top: 0px;
  left: 0px;
}

/* last movie */
.skew_last{
  position: relative;
  display: block;
}

.inner_projects{
  float: left;
  list-style-type: none;
  padding: 0;
  margin-right: 6px;
}



.active a{ color: red; }

/* hidden fields li */
.h{ /**/ }

#en{ position: fixed; right: 45px; top: 10px; float: right; display: block; }
#de{ position: fixed; right: 10px; top: 10px; float: right; display: block; }
#log{ position: fixed; right: 80px; top: 7px; float: right; display: block; }
#i{ position: fixed; right: 8px; bottom: 8px; float: right; display: block; opacity: 0.5; font: 65% "Lucida Grande", sans-serif;}

#login{ 
  text-align: center; 
  font-weight: 900; 
  font: 9px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; 
  width: 140px; 
  color: #555;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border: 1px solid #666;
  padding: 3px;
}

/* film top TITLE Year description*/
.ppt{
  letter-spacing: 1px;
  font-family: 'Courier New', Courier, monospace;
  position: relative !important;
  top: -10px !important;
}


/* pretty photo bottom film description*/
.pp_description{
  font: 11px 'Courier New', Courier, monospace;
  padding-left: 3px;
  padding-right: 3px;
  padding-top: 5px;
}

.pp_description b{
  color: red;
  font-weight: normal;
}




  
.tipsy{
  font: 11px 'Courier New', Courier, monospace !important;
  text-shadow:#000 1px 1px 1px;
}

.tipsy b{
  font-weight: normal;
  opacity: 0.9;
}


#copy{
  font: 11px 'Courier New', Courier, monospace;
  color: #666;
  width: 90%;
  text-align: right;
  margin-top: 3px;
  display: none;
}

/* errors */
.small{
 font: 65% "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
 color: #ccc;
}

/* contact imprint */
.mono{
  font: 11px 'Courier New', Courier, monospace;
  font-size-adjust:0.45;
  color: #393939;
  line-height: 15px;
}

.vita{
  font: 11px 'Courier New', Courier, monospace;
  font-size-adjust:0.45;
  color: #393939;
  line-height: 15px;
}


/* box that'll hold number '*/
.num{
  display: none;
  width: auto !important;
}

/* Emphasise Heading */
em{
  border-bottom: 1px solid #999;
  font-style: normal;
  color: #999;
}

.write{
  font-size: 120%;
}

.write img{
  border: none !important;
  width: 13px !important;
  height: 14px !important;
  padding: 0 !important;
  margin: 0 !important;
  -moz-box-shadow: 0 0 0 #fff !important;
  -webkit-box-shadow: 0 0 0 #fff !important;
  -moz-border-radius: 0 !important; 
  -webkit-border-radius: 0 !important; 
}


.huge{
  text-align: center !important;
  padding-left: 25px;
  padding-right: 25px;
  font: 4.8em 'Courier New', Courier, monospace;
  font-size-adjust:0.45;
}

.huge::selection, .mono::selection { background-color: #333; color: #fff; }

.tel a, .fax a{
  color: red;
}

/* tel f& fax no. */
.clean{
  display: inline;
  list-style-type: none;
  list-style-image:none;
  list-style-position:outside;
  padding: 0px;
  margin: 0px;
}

.red{
  color: red !important;
}
