/*

Jason Wishnow

reel.css


*/


/* /// HTML Body Basics //////////////////////////////// */

* {
	margin:0;
	padding:0;
}

html, body {
	height:100%;
	min-width: 720px;
}
		
body {
	font-family:Helvetica,HelveticaNeue,Arial,Helv,sans-serif;
	font-size:11.5px;
	color:#666666;
	background:#ffffff;
	margin:0;
	padding:0;
    height:100%;
	position:relative;
	font-weight:normal;
	}

a:link {
	color:#90a3b7;
	text-decoration:none;
}
a:visited {
	color:#90a3b7;
	text-decoration:none;
}
a:hover {
	color:#333366; 
	text-decoration:underline;
} 
a:active {
	color:#eef1f4; 
	text-decoration:underline;
}



/* /// Main Fonts //////////////////////////////// */



h1 {
	font-size:28px;
	color:#000000;
	margin-top:42px;
	margin-bottom:0;
	position:relative;
	font-weight:lighter;
    letter-spacing:-1px;
}


h2 {
	font-size:11px;
	color:#90a3b7;
	text-transform: uppercase; 
	margin-top:33px;
	margin-bottom:0px;
	position:relative;
	font-weight:lighter;
    letter-spacing:11px;
}


p {
	font-family:Helvetica,Arial;
	font-size:11.5px;
	line-height:17.5px;
	margin:0;
	position:relative;
}

.tight {
	letter-spacing:-1px;
}

.wide {
	letter-spacing:1px;
}

.description {
	font-size:11px; 
	line-height:17.5px;
	color:#333366; 
	font-weight:lighter;
    letter-spacing:0px;
}

.discuss {
	font-size:11px; 
	line-height:17.5px;
	color:#90a3b7; 
	text-align:right;
	font-weight:lighter;
    letter-spacing:0px;
}



.spaced {
	letter-spacing:0px;
}



.oldnews {
	color:#90a3b7;
}


h3 {
text-align:right;
color:#90a3b7;
padding-top:0;
padding-bottom:0;
padding-right:12px;
padding-left:0;
font-size:11px;
margin:0;
letter-spacing:1px;
line-height:29.95px;
text-decoration:none;
font-weight:lighter;
}




/* /// Main Container Link Fonts //////////////////////////////// */



.plink {
	background:#90a3b7;
	color:#000000;
	text-decoration:none;
	font-size:11.5px;
	line-height:17.5px;
    letter-spacing:0px;
}



.plink:link {
	background:#ffffff;
	color:#90a3b7;
	text-decoration:none;
	font-size:11.5px;
	line-height:17.5px;
    letter-spacing:0px;
}


.plink:visited {
	background:#ffffff;
	color:#90a3b7;
	text-decoration:none;
	font-size:11.5px;
	line-height:17.5px;
    letter-spacing:0px;
}


.plink:hover {
	background:#90a3b7;
	color:#000000;
	text-decoration:none;
	font-size:11.5px;
	line-height:17.5px;
    letter-spacing:0px;
}


.plink:active {
	background:#eef1f4;
	color:#ffffff;
	text-decoration:none;
	font-size:11.5px;
	line-height:17.5px;
    letter-spacing:0px;
}





/* /// Containers //////////////////////////////// */




#container-center {
text-align:center;
width:680px;
margin:0 auto;
padding:0;
position:relative;
}


#main-center {
text-align:center;
width:680px;
position:relative;
margin-top:0;
margin-bottom:0;
margin-right:0;
margin-left:0;
z-index:1;
}


#container-3columns {
width:1010px;
margin:0 auto;
padding:0;
position:relative;
}


#container-right {
float:right;
width:845px;
margin:0;
padding:0;
position:relative;
z-index:9;
}


#nav {
float:left;
text-align:left;
width:165px;
height:400px;
position:fixed;
margin-top:152px;
margin-bottom:0;
margin-right:0;
margin-left:0;
padding:0;
background:#ffffff;
z-index:10;
}


#main {
float:left;
text-align:left;
width:680px;
position:relative;
margin-top:0;
margin-bottom:0;
margin-right:0;
margin-left:0;
z-index:1;
}


#contact {
float:right;
text-align:right;
width:165px;
height:400px;
position:fixed;
margin-top:152px;
margin-bottom:0;
margin-right:0;
margin-left:680px;
padding-top:0;
padding-bottom:0;
padding-right:0;
padding-left:0;
background:#ffffff;
z-index:2;
}



#header {
top:0;
margin:0 auto;
width:1000px;
height:0px;
clear:both;
position:fixed;
}


#spacer {
top:0;
margin:0 auto;
width:1000px;
height:0px;
clear:both;
position:fixed;
}

#push {
top:0;
margin:0 auto;
width:1;
height:100px;
clear:both;
position:fixed;
}


#insert {
padding-top:0;
padding-bottom:0;
padding-right:12px;
padding-left:0;
}


#nav-index {
float:left;
text-align:left;
width:165px;
height:262px;
position:fixed;
margin-top:67px;
margin-bottom:0;
margin-right:0;
margin-left:0;
padding:0;
background:#ffffff;
z-index:10;
}

#contact-index {
float:right;
text-align:right;
width:165px;
height:262px;
position:fixed;
margin-top:67px;
margin-bottom:0;
margin-right:0;
margin-left:680px;
padding-top:0;
padding-bottom:0;
padding-right:0;
padding-left:0;
background:#ffffff;
z-index:2;
}



/* /// Navigation //////////////////////////////// */




#nav ul {
margin:0; 
padding:0; 
background-color:#ffffff;
}

#nav ul li {
height:25px;
line-height:25px;
list-style:none;
margin:0;
padding-top:0;
padding-bottom:0;
padding-left:8px;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
cursor:pointer;
}  


#nav-index ul {
margin:0; 
padding:0; 
background-color:#ffffff;
}

#nav-index ul li {
height:25px;
line-height:25px;
list-style:none;
margin:0;
padding-top:0;
padding-bottom:0;
padding-left:8px;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
cursor:pointer;
}  


.navlink {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.navlink:link {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.navlink:visited {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.navlink:hover {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#000000;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.navlink:active {
background-color:#90a3b7;
color:#ffffff;
border-style:solid;
border-color:#90a3b7;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}


.black {
background-color:#000000;
color:#ffffff;
border-style:solid;
border-color:#000000;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
}

.white {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#000000;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
}

.clean {
background-color:#ffffff;
color:#000000;
border-style:solid;
border-color:#ffffff;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
}

.grey {
background-color:#eef1f4;
color:#000000;
border-style:solid;
border-color:#eef1f4;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
}

.sublink {
background-color:#eef1f4;
color:#222222;
border-style:solid;
border-color:#eef1f4;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.sublink:link {
background-color:#eef1f4;
color:#222222;
border-style:solid;
border-color:#eef1f4;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.sublink:visited {
background-color:#eef1f4;
color:#222222;
border-style:solid;
border-color:#eef1f4;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.sublink:hover {
background-color:#eef1f4;
color:#222222;
border-style:solid;
border-color:#222222;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}

.sublink:active {
background-color:#90a3b7;
color:#ffffff;
border-style:solid;
border-color:#90a3b7;
border-width:2px;
padding:2px;
position:relative;
font-size:10px;
margin:0;
letter-spacing:1px;
text-decoration:none;
}


/* /// Main Content //////////////////////////////// */




.whitecontainer {
	position:relative;
	margin:0px auto;
	text-align:left;
	width:680px;
	border:0;
	padding-top:0px; 
	padding-left:0px; 
	padding-right:0px; 
	padding-bottom:1px; 
	background:#ffffff;
}

.blackcontainer {
	position:relative;
	margin:0px auto;
	text-align:left;
	width:640px;
	border:0;
	padding:20px;
	background:#eef1f4;
}

.blackestcontainer {
	position:relative;
	margin:0px auto;
	text-align:left;
	width:640px;
	border:0;
	padding:20px;
	background:#000000;
}



.project {
    margin-left: auto;
    margin-right: auto;
	text-align:center;
	z-index:100;
}


.alpharollover:link img { opacity:0.4; filter:alpha(opacity=40); }
.alpharollover:hover img { opacity:1.0; filter:alpha(opacity=100); }
.alpharollover:active img { opacity:0.1; filter:alpha(opacity=10); }


.betarollover:link img { opacity:1.0; filter:alpha(opacity=100); }
.betarollover:hover img { opacity:0.8; filter:alpha(opacity=80); }
.betarollover:active img { opacity:0.2; filter:alpha(opacity=20); }


/* /// Index Vertical Center //////////////////////////////// */


	#distance { 
		width:1px;
		height:50%;
		background-color:#fc6;
		margin-bottom:-202px; /* half of container's height */
		float:left;
	}

	#container {
		margin:0 auto;
		position:relative; /* puts container in front of distance */
		text-align:left;
		height:404px;
		width:1010px;
		clear:left;
		background-color:#ffffff;
	}



/* /// End //////////////////////////////// */


/* Additions by Jurawa Design - optimize for iphone, ipad and small browser window */

/* Standard Broswers */
@media all and (max-width: 1024px) {

#contact-index {
position: absolute;

}
#nav-index {

position: absolute;
}

#nav {

position: absolute;
}
#contact {
position: absolute;
}

}

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
#contact-index {
position: absolute;

}
#nav-index {

position: absolute;
}

#nav {

position: absolute;
}
#contact {
position: absolute;
}
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
#contact-index {
position: absolute;

}
#nav-index {

position: absolute;
}

#nav {

position: absolute;
}
#contact {
position: absolute;
}
}