/*------------------------------------------------------------

	Styles.css
	Heller Lab
	
	Last Modified : 	February 3rd, 2012
	Created by : 		Ron San Jose, ronsj.com
	Contact: 			ron@ronsj.com
	
--------------------------------------------------------------*/

/*------------------------------------------------------------ 

	Table of Contents

	1-Site
	2-Navigation
	3-Header
	4-Body
	5-Footer
	6-Subpages
	7-Type

--------------------------------------------------------------*/

/*--------------------------------------------------------------
	1-Site
--------------------------------------------------------------*/

@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) 
{ 
	#content-bg {visibility: hidden;}

	.hidden {visibility: hidden;}
}

@media handheld, only screen and (-webkit-device-pixel-ratio:1.5){
	#content-bg {visibility: hidden;}

	.hidden {visibility: hidden;}
}

@media handheld, only screen and (-webkit-device-pixel-ratio:2.0){
	#content-bg {visibility: hidden;}

	.hidden {visibility: hidden;}
}

html {
	height: 100%;
	overflow-y: scroll;
	overflow: -moz-scrollbars-vertical;
}

* {
	margin:0;
	padding:0;
} 

article, aside, figcaption, figure, footer, header, hgroup, nav, section
{
    display: block;
}

body {
	height: 100%;
	background-image: url('../images/assets/bg.png');
	background-repeat: repeat;
	background-color: #ebebeb;
	background-attachment: fixed;
}

img {
	border: 0;
}

a:link {color: #004aae; text-decoration: none;}
a:visited {color: #004aae; text-decoration: none;}
a:hover {color: #5b97e7; text-decoration: none;}
a:selected {color: #5b97e7; text-decoration: none;}

nav a:link {color: #fff; text-decoration: none;}
nav a:visited {color: #fff; text-decoration: none;}
nav a:hover {color: #f3d673; text-decoration: none;}
nav a:selected {color: #f3d673; text-decoration: none;}

footer a:link {color: #6cabff; text-decoration: none;}
footer a:visited {color: #6cabff; text-decoration: none;}
footer a:hover {color: #f3d673; text-decoration: none;}
footer a:selected {color: #f3d673; text-decoration: none;}

a.caption:link {color: #004aae; text-decoration: none;}
a.caption:visited {color: #004aae; text-decoration: none;}
a.caption:hover {color: #004aae; text-decoration: underline;}
a.caption:selected {color: #004aae; text-decoration: underline;}

a.black:link {color: #111; text-decoration: none;}
a.black:visited {color: #111; text-decoration: none;}
a.black:hover {color: #111; text-decoration: none;}
a.black:selected {color: #111; text-decoration: none;}

#container {
	min-height: 100%;
	width: 100%;
}

/*--------------------------------------------------------------
	2-Navigation
--------------------------------------------------------------*/

nav {
	position: relative;
	background-image: url('../images/assets/bg_nav.png');
	background-repeat: repeat;
	background-color: #93c1ff;
	background-attachment: fixed;
	margin: 0;
	border-width: 0 0 5px 0;
	border-style: solid;
	border-color: #93c1ff;
	height: 40px;
	width: 100%;
	-webkit-box-shadow: 0 -10px 40px -10px #004aae inset;
	-moz-box-shadow: 0 -10px 40px -10px #004aae inset;
	box-shadow: 0 -10px 40px -10px #004aae inset;
	z-index:700;
}

nav ul {
	position: relative;
	display: block;
	width: 920px;
	list-style: none;
	margin: 0 auto;
	padding: 0 0 0 40px;
}

nav ul li {
	float: left;
	margin: 0;
	padding: 0;
}

nav ul li a {
	display: block;
	padding: 0 40px 0 0px;
	margin: 0;
	font: 16px 'novecentowideDemibold', Arial, sans-serif;
	line-height: 40px;
	vertical-align: 50%;
	text-shadow: 1px 1px #004aae;
	letter-spacing: 1.5px;
}

/*--------------------------------------------------------------
	3-Header
--------------------------------------------------------------*/

header.home {
	display: block;
	position: relative;
	background: #fff;
	margin: 0;
	padding: 0;
	height: 410px;
	width: 100%;
	-webkit-box-shadow: 0 10px 40px -10px #959595;
	-moz-box-shadow: 0 10px 40px -10px #959595;
	box-shadow: 0 10px 40px -10px #959595;
	z-index:900;
}

header.subpage {
	display: block;
	position: relative;
	background: #fff;
	margin: 0 auto;
	padding: 0;
	height: 170px;
	width: 960px;
	z-index:900;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #ebebeb;
}

section.banner {
	position: relative;
	width: 920px;
	margin: 0 auto;
	padding: 40px 0 0 40px;
	z-index:1000;
}

figure.heller {
	position: relative;
	width: 473px;
	margin: 0;
	padding: 0;
}

figure.ucsd {
	position: relative;
	float: right;
	background: #004aae;
	margin: -161px 0 0 0;
	padding: 20px;
	height: 150px;
	width: 150px;
	z-index:1000;
}

/*--------------------------------------------------------------
	4-Body
--------------------------------------------------------------*/

#content {
	background: #fff;
	width: 960px;
	padding-bottom: 190px;
	overflow: auto;
	margin: 0 auto;
	z-index: 100;
}

#content-bg {
	position: fixed;
	background: #fff;
	width: 960px;
	height: 100%;
	left: 50%;
	margin-left: -480px;
	z-index: -1000;
}
article {
	margin: 0;
	padding: 0;
	z-index: 100;
}

article section {
	float: left;
	width: 880px;
	padding: 0 40px 80px;
}

#backnav {
	float: left;
	margin: 0;
	padding: 40px 0 0 40px;
	font: 14px 'DejaVuSansBook', Arial, sans-serif;
	color: #004aae;
	line-height: 1.5;
}

#title {
	float: left;
	margin: 0;
	padding: 40px 0 40px 40px;
	font: 35px 'DejaVuSerifBold', Arial, sans-serif;
	color: #004aae;
	line-height: 1.5;
}

#title-pic {
	float: left;
	margin: 0;
	padding: 0;
	width: 960px;
}

#section-title {
	float: left;
	width: 840px;
	margin: 0 0 40px 0;
	padding: 40px 40px 0 0;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #ebebeb;
	font: 29px 'DejaVuSerifBold', Arial, sans-serif;
	color: #111;
	line-height: 2.0;
}

#line {
	float: left;
	width: 840px;
	margin: 0 0 40px 0;
	padding: 40px 40px 0 0;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #ebebeb;
}

img.full {
	float: left;
	margin: 0;
	padding: 0 0 40px;
	width: 880px;
}

img.left {
	float: left;
	display: inline;
	margin: 0;
	padding: 0 40px 40px 0;
}

img.right {
	float: right;
	display: inline;
	margin: 0;
	padding: 0 0 40px 40px;
}

img.center {
	float: none;
	width: 100%;
	margin: 20px auto 40px;
	padding: 0;
	
}

/*--------------------------------------------------------------
	5-Footer
--------------------------------------------------------------*/

footer {
	position: relative;
	background-color: #004aae;
	border-width: 5px 0 0 0;
	border-style: solid;
	border-color: #93c1ff;
	margin: -195px auto 0;
	height: 190px;
	width: 960px;
	clear: both;
	z-index: 500;
}

footer ul {
	list-style: none;
	margin: 0 0 0 40px;
	padding: 0;
	width: 150px;
}

footer ul li {
	margin: 0 0 10px 0;
	padding: 0;
}

footer ul li a {
	display: block;
	padding: 0;
	margin: 0;
	font: 10px 'novecentowideMedium', Helvetica, Arial, sans-serif;
	line-height: auto;
	vertical-align: 50%;
	letter-spacing: 2px;
}

figure.hellerfoot {
	margin: 25px 0 10px 40px;
	padding: 0;
}

figure.ucsdfoot {
	margin: 0 0 10px 0;
	padding: 0;
}

section.copyright {
	float: right;
	margin: -53px 40px 0 0;
	padding: 0;
	font: 10px 'DejaVuSansBook', Helvetica, Arial, sans-serif;
	color: #fff;
	text-align: right;
}

/*--------------------------------------------------------------
	6-Subpages
--------------------------------------------------------------*/

#list-name {
	float: left;
	margin: 0;
	width: 100%;
	padding: 0 0 40px 0;
	font: 23px 'DejaVuSerif', Georgia, Times, 'Times New Roman', serif;
	color: #111;
	line-height: 20px;
}

#list-pic {
	float: left;
	width: 266px;
	margin: 0;
	padding: 0;
}

#list-info {
	float: left;
	width: 574px;
	margin: 0;
	padding: 0 0 0 40px;
}

#full {
 	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
}

#contact-map {
	float: left;
	margin: 0;
	padding: 0;
	width: 440px;
	font: 14px Helvetica, Arial, sans-serif;
	color: #111;
	line-height: 23px;
}

#contact-details {
	float: left;
	margin: 0 0 0 20px;
	padding: 0;
	width: 420px;
}

/*--------------------------------------------------------------
	7-Type
--------------------------------------------------------------*/

h1 {
	font: 29px 'DejaVuSerif', Arial, sans-serif;
	color: #111;
	margin: 0;
	padding: 0 0 20px;
	line-height: 1.5;
}

h1 b {
	font: 29px 'DejaVuSerifBold', Arial, sans-serif;
	color: #111;
	margin: 0;
	line-height: 1.5;
}

h1 i {
	font: 29px 'DejaVuSerifItalic', Arial, sans-serif;
	color: #111;
	margin: 0;
	line-height: 1.5;
}

h1 b i {
	font: 29px 'DejaVuSerifBoldItalic', Arial, sans-serif;
	color: #111;
	margin: 0;
	line-height: 1.5;
}

h2 {
	font: 23px 'DejaVuSerif', Georgia, Times, 'Times New Roman', serif;
	color: #111;
	margin: 0 0 20px 0;
	line-height: 1.5;
}

h3 {
	font: 17px 'DejaVuSerif', Arial, sans-serif;
	color: #111;
	margin: 0 0 20px 0;
	line-height: 1.5;
}

p {
	display: block;
	font: 14px Helvetica, Arial, sans-serif;
	color: #111;
	margin: 0 0 20px 0;
	line-height: 23px;
}

small {
	font: 11px 'DejaVuSansBook' Helvetica, Arial, sans-serif;
}

@font-face {
    font-family: 'NovecentowideMedium';
    src: url('../fonts/novecentowide-medium-webfont.eot');
    src: url('../fonts/novecentowide-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/novecentowide-medium-webfont.woff') format('woff'),
         url('../fonts/novecentowide-medium-webfont.ttf') format('truetype'),
         url('../fonts/novecentowide-medium-webfont.svg#NovecentowideMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'NovecentowideDemiBold';
    src: url('../fonts/novecentowide-demibold-webfont.eot');
    src: url('../fonts/novecentowide-demibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/novecentowide-demibold-webfont.woff') format('woff'),
         url('../fonts/novecentowide-demibold-webfont.ttf') format('truetype'),
         url('../fonts/novecentowide-demibold-webfont.svg#NovecentowideDemiBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVuSerif';
    src: url('../fonts/DejaVuSerif-webfont.eot');
    src: url('../fonts/DejaVuSerif-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DejaVuSerif-webfont.woff') format('woff'),
         url('../fonts/DejaVuSerif-webfont.ttf') format('truetype'),
         url('../fonts/DejaVuSerif-webfont.svg#DejaVuSerif') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVuSerifBold';
    src: url('../fonts/DejaVuSerif-Bold-webfont.eot');
    src: url('../fonts/DejaVuSerif-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DejaVuSerif-Bold-webfont.woff') format('woff'),
         url('../fonts/DejaVuSerif-Bold-webfont.ttf') format('truetype'),
         url('../fonts/DejaVuSerif-Bold-webfont.svg#DejaVuSerifBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVuSerifItalic';
    src: url('../fonts/DejaVuSerif-Italic-webfont.eot');
    src: url('../fonts/DejaVuSerif-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DejaVuSerif-Italic-webfont.woff') format('woff'),
         url('../fonts/DejaVuSerif-Italic-webfont.ttf') format('truetype'),
         url('../fonts/DejaVuSerif-Italic-webfont.svg#DejaVuSerifItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVuSerifBoldItalic';
    src: url('../fonts/DejaVuSerif-BoldItalic-webfont.eot');
    src: url('../fonts/DejaVuSerif-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DejaVuSerif-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/DejaVuSerif-BoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/DejaVuSerif-BoldItalic-webfont.svg#DejaVuSerifBoldItalic') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'DejaVuSansBook';
    src: url('../fonts/DejaVuSans-webfont.eot');
    src: url('../fonts/DejaVuSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/DejaVuSans-webfont.woff') format('woff'),
         url('../fonts/DejaVuSans-webfont.ttf') format('truetype'),
         url('../fonts/DejaVuSans-webfont.svg#DejaVuSansBook') format('svg');
    font-weight: normal;
    font-style: normal;

}