
/* --- START OF CSS --- */
/*BODY and OVERALL SETTINGS*/
body {
	color:rgb(2,2,2);
	background-color:rgb(253,253,253);
	opacity:1.0; filter:alpha(opacity=100);
}
/*Background Images*/
img.new {
	width: 100%;
}
div.new {
    position: fixed; 
	top: 105px;
	left: 0px;
	width: 100%;
	z-index: -2; 
    opacity:0.0069385773009527;
    filter:alpha(opacity=0.69385773009527);
}
  
.moon {
	position: fixed;
	left: 50.345%;
	top: 102.76px;
	height: 100px;	
	width: 100px;
    background: rgb(255,255,255);
	 -webkit-border-radius: 150px;
     -moz-border-radius: 150px;
     border-radius: 150px;
     -moz-box-shadow: 0em 0.7em 4em 0.1em black;
     -webkit-box-shadow: 0em 0.7em 4em 0.1em black;
     box-shadow: 0em 0.7em 4em 0.1em black;
	 /*h-shadow v-shadow blur spread color inset-outset;*/
	z-index: -4; 
}
.shadow {
	position: fixed;
	left: 50.345%;
	top: 3.45px;	
	height: 100px;	
	width: 100px;
    background: rgb(253,253,253);
	 -webkit-border-radius: 50px;
     -moz-border-radius: 50px;
     border-radius: 50px;
     -moz-box-shadow: 0 0 1em #000;
     -webkit-box-shadow: 0 0 1em #000;
     box-shadow: 0 0 1em black;
    opacity:0.60693857730095;
    filter:alpha(opacity=0.69385773009527);
	z-index: -3; 
}

/*all the DIVs are in here*/
.container {
    margin: auto;
	width: 720px;
 	text-align: center;
}

/*---- HEADING AND MENU ----*/
div.titleback {
	position: fixed; 
	top: 0px; 
	margin-left: -15px;
	height: 105px;	
	width: 110%;
    background: rgb(253,253,253);
     -webkit-border-radius: 0.5em;
     -moz-border-radius: 0.5em;
     border-radius: 0.5em;
     -moz-box-shadow: 0 0 1em #500;
     -webkit-box-shadow: 0 0 1em #500;
     box-shadow: 0 0 1em red;
	z-index: 0; 
 	opacity: 0.9; 
	filter: alpha(opacity=90); 
}
div.title { 
	font: 3.2em "Palatino Linotype", serif; 
	font-weight: lighter; 
	letter-spacing: 3.8px; 
	position: fixed; 
	top: 10px;
 	margin-left: 85px; 
	z-index: 1; 
 	opacity: 1; 
	filter: alpha(opacity=100); 
}
#menu { 
	font: 1.2em "Palatino Linotype", serif; 
	font-weight: lighter; 
	text-decoration: none;  
	z-index: 0; 
	position: fixed; 
 	margin-left: 135px; 
	top: 35px; 
	padding: 0.75em;
	opacity: 0.9; 
	filter: alpha(opacity=90);}
.top { 
	letter-spacing: 2.0px; 
	cursor: pointer; 
	padding: 0px;
}
#menu ul .item { 
	display: none; 
	padding: 0.25em 0.5em 0.25em 0.5em;
}
#menu ul:hover .item { 
	display: block; 
opacity: 0.9; 
	filter: alpha(opacity=90);
	z-index: 0;
	background: rgb(253,253,253);
	padding: 0.25em 0.25em 0.25em 0.5em;
} 
#menu ul {
	width: 120px; 
	float: left; 
	color:rgb(2,2,2);
	padding: 10px; 
	list-style: none; 
}
/*----CONTENT------*/

div.content { 
		margin-top: 175px; 	
	clear: both; 
}
font.content { 
	font: normal bold 1.1em "Tahoma", sans-serif; 
	font-weight: lighter; 
	color: rgb(2,2,2); 
}
a { 
	text-decoration: underline; 
	border-style: none; 
}
a:link { 
	text-decoration: underline; 
	border-style: none; 
	color: rgb(2,2,2); 
}
a:visited { 
	color: rgb(2,2,2); 
}
font.subheading { 
	color: rgb(2,2,2); 
}
font.heading { 
	color: rgb(2,2,2); 
	font-size: 1.3em; 
	letter-spacing: 1.5px; 
	font-weight: 100; 
}
/*nologo----*/
img.nologowhite {
	position: absolute;
     top: 196px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
	width: 420px;
	opacity: 0.0069385773009527; 
    filter: alpha(opacity=40); 
}	
img.nologoblack {
	position: absolute;
    top: 196px;
    left: 0; right: 0;
    margin: 0 auto 0 auto;
	width: 420px;
	opacity: 1; 
    filter: alpha(opacity=100); 
	 z-index: -1;
}	
/*ABOUT----*/
div.about {
	position: absolute;
     top: 176px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
     width: 720px;
     background: #C0C0C0; 
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em;
	 height: 360px;
	 z-index: -1;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
}	
/*PRODUCTIE----*/
#sample1 { ;  }
#sample2 { ;  }
a.weblink {
	color: #fff;
}
font.production {
	font-size: 12px;
}
/*the matte backing */
div.webcontainerback, div.productiecontainerback, div.samplesback, div.portfolioback { 
	position: absolute;
     top: 176px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
     background: #C0C0C0; 
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em 1em;
	 z-index: -1;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
}
div.webcontainerback {
	height: 480px;
	width: 25%;
}
div.samplesback {
	height: 860px;
	width: 330px;
}
div.portfolioback {
	height: 1070px;
	width: 330px;
}
div.productiecontainerback { 
	height: 380px;
    width: 50%;
}	
div.webcontainer { 
	margin: auto;
	width: 25%; 
	text-align: center;
}
div.samplescontainer { 
	margin: auto;
	width: 25%; 
	text-align: center;
}
#mediaplayer_port { 
	margin-left: -180px;
}
#mediaplayer_samp { 
	margin-left: -180px;
}
div.productiecontainer { 
	margin-left: 120px;
	text-align: left; 
	width: 50%; 
	padding: 1.5em 1.5em 1.5em 1.5em; 
	line-height: 100%; 
	line-height: 120%;
}
font.productie { 
	font-size: 0.75em; 
	font-style: normal; 
	letter-spacing: 2px; 
}
div.productiehead, 
div.archivefoot { 
	padding: 0.5em; 
	background-color: transparent; 
	clear: left; 
}
div.productiesub 	{ 
	background-color: transparent; 
	clear: left;  
}
div.productieimage { 
	margin-left: 280px; 
	margin-top: -25px; 
	border-left: 0px solid gray; 
	padding: 0.1em; 
	text-align: left; 
	clear: right; 
}
div.productietext { 
	margin-left: 25px; 
	float: left; 
	padding: 0.25em; 
	letter-spacing: 2.2px; 
}
	
/*PROJECTS-----CONTENT*/
/*NOW*/
div.now { 
	position: absolute;
     top: 176px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
     width: 720px;
     background: #C0C0C0; 
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em;
	 height: 460px;
	 z-index: -1;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
}

}
font.now { 
	font-size: 1.0em; font-style: bold; 
}

/*ULTRASOUND*/
div.ultracontainer { 
	width: 100%; 
	margin: 0px; 
	border: 0px solid gray; 
	line-height: 150%; 
	font-size: 1.2em;
}
div.ultrahead, 
div.ultrafoot { 
	padding: 0.5em; 
	color: white; 
	background-color: transparent; 
	clear: left; 
}
div.ultraimage { 
	float: left; 
	padding: 0em 0em 0em 0em; 
}
img.ultra2 { 
	width: 120px; 
	padding: 0em 0em 0em 1.5em; 
}
img.ultra { 
	width: 160px; 
}
div.ultraback { 
	position: fixed; 
	top: 225px; 
	right: auto; 
	left: auto; 
	z-index: -1; 
	opacity: 0.15; 
	filter: alpha(opacity=15); 
}
img.ultraback { 
	height: 460px; 
}
div.ultrabackmatte {
	position: fixed;
     top: 180px;
     right: auto;
     left: auto;
     width: 677px;
     height: 540px;
	 background: #C0C0C0; 
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em;
	 z-index: -2;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
}
div.ultratext { 
	margin-left: 185px; 
	border-left: 1px solid gray; 
	padding: 0em 3.0em 1.0em 1.5em; 
	text-align: left; 
}
font.ultratitle { 
	font-size: 1.2em; 
	letter-spacing: 2px; 
	font-weight: 400; 
}
font.ultra { 
	font-size: 0.75em; 
	font-style: bold; 
}
/*ARCHIVE in making the table(less) with CSS, div needs the float. alignment between text and image is made by top-padding the image. since the size of the box is not declared, then the content determines the size and wrap position.*/
div.archivecontainerback {
	position: absolute;
     top: 175px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
     width: 720px;
     background: #C0C0C0; color: #fff;
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em 1em;
	 height: 4580px;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
	z-index: -1; 
}
div.archivecontainer { 
	width: 100%; 
	border: 0px solid gray; 
	line-height: 130%; 
	letter-spacing: 2.0px; 
	
}
div.archivehead, 
div.archivefoot { 
	padding: 0.5em; 
	background-color: transparent; 
	clear: left; 
}
div.archiveimage { 
	height: 120px;
	float: left; 
	padding: 1.5em 0em 0em 1.6em; 
}
img.archive { 
	width: 120px; 
	margin: 0; 
}
#player1, 
#player2,
#player3,
#player4,
#player5,
#player6,
#player7,
#sound1,
#sound2,
#sound3,
#sound4,
#sound5,
#sound6,
#sound7 { 
	float: left;
}

div.archivetext { 
    line-height: 130%;
	height: 120px;
	margin-left: 210px; 
	border-left: 0px solid gray; 
	padding: 1em; 
	text-align: left; 
	clear: right; 
}
#disc {
	height: 260px;
}
font.archivetitle { 
	font-size: 17px; 
	letter-spacing: 2px; 
	font-weight: 100;  
}
font.archive { 
	font: 15px Tahoma, monospace; 
}
font.sub { 
	font-size: 0.7em; 
}
div.who {
	font-family: "Courier New", Courier, monospace;
}
div.whoandwhat {
	position: absolute;
     top: 175px;
     left: 0; right: 0;
     margin: 0 auto 0 auto;
     width: 720px;
     background: #C0C0C0; color: #fff;
     -webkit-border-radius: 1.5em;
     -moz-border-radius: 1.5em;
     border-radius: 1.5em;
     padding: 0.5em 1em;
	 height: 1400px;
	opacity: 0.4; 
	filter: alpha(opacity=40); 
	z-index: -1; 
}
/*END PROJECTS*/


