/* Stylesheet for Centers Revised January 23, 2015*/

/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
body {line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}

/* Always show the vertical scroll bar so content doesn't shift right and left between long and short pages - Large Devices Only*/
@media only screen and (min-device-width : 900px) {
	html {overflow-y: scroll;}
}

/* ------------------------------------------------------
   Main Page Divisions
	 ------------------------------------------------------*/

body {
  font-size: 90%;
	line-height: 160%;
	font-family: "Helvetica Neue", Helvetica,  Arial, sans-serif;
	width: 100%;
  color: #252525;
  background: #00447C url(images/bg.png) repeat-x top;
}

/* -------------------- Page Header  --------------------*/

p.skip { /* This is for accessibility links. */
	display:none;
}

header#page-header {
	max-width:990px;
	min-width:768px;
	width: 97%;
	height: 124px;
	padding: 0 0 10px 0;
	margin: 0 auto 0 auto;
}

header#mobile-page-header {
	width:100%;
	display:none;
}

#banner-title {
	margin-top:22px;
	clear: both;
	max-width:99%;
}

#college-logo {
	float:right;
}

#uta-logo {
	float:left;
}

#mobile-logo {
	float:left;
	height: 55px;
	margin-right: 7px;
	margin-left: 7px;
	display: none;
}

#site-name {
	font-family: "Arbutus Slab", "Times New Roman", serif;;
	font-size: 30px;
	line-height: 100px;
	vertical-align: middle;
	display: block;
	margin-top:0;
}

#site-name a, #site-name a:visited {
	text-decoration: none;
	color: #CD5E0A;
}

#site-name a:hover {
	color: #F20D2B;
}

/* -------------------- Content Wrapper --------------------*/

#wrapper {
	max-width:990px;
	min-width:748px; /* This allows for the padding */
	width: 97%;
	padding: 20px 1.25% 10px 1.25%;
	margin: 0 auto 0 auto;
  background: #fff url(images/bg_wrapper.png) repeat-x top;
}

.content-third {
	width: 32.323%;
	margin-left: 1.515%;
	float:left;
	overflow-x:hidden;
}

.content-third:first-child {
	margin-left: 0%;
}

#page-content { /* Need a margin from the two floating elements */
	width: 100%;
	margin:0;
	padding: 0;
	overflow-y:auto;
}

#content-wide {
	width: 69%;
	margin: 0;
	float: left;
	overflow-x:hidden;
}

aside {
	width: 29.5%;
	margin: 0 0 0 1.5%;
	float: right;
	overflow-x:hidden;
}

#content-full {
	width: 100%;
	margin: 0;
	overflow-x:hidden;
}

/* -------------------- Page Footer --------------------*/

footer {
	width: 96.5%;
	padding: 10px 1.75% 10px 1.75%;
	margin-top: 15px;
	background-color: #CD5E0A;
	color: #efefef;
	clear:both;
	font-size: 85%;
	overflow-x:hidden;
}

#credit {
	width: 99%;
	text-align:right;
	color: #aaa;
	font-size:80%
}

/* -------------------- Front Page Only --------------------*/

#front-pic {
	width: 66.161%;
	float: right;
}

#front-image {
	max-width: 100%;
}

#front-first {
	width: 32.323%;
	float: left;
}

#front-first img {
	max-width: 100% /* in case someone puts an image here. */
	height: auto;
}

#front-bottom { /*The bottom must clear the top content. */
	width: 100%;
	clear:both;
	padding-top: 15px;
	overflow-y:auto;
}

/* ------------------------------------------------------
   Forms
	 ------------------------------------------------------*/

/* ------------------------------------------------------
   Typography
	 ------------------------------------------------------*/

/* -------------------- Headings --------------------*/

h1,h2,h3,h4,h5,h6 {
	font-family: "Arbutus Slab", "Times New Roman", serif;
	font-size: 24pt;
	line-height: 130%;
	margin: 5px 0 10px 0;
	color: #CD5E0A;
}

h2 {
	font-size: 160%;
	color: #004470;
}

h3 {
	font-size: 140%;
	margin: 3px 0 10px 0;
	color: #004470;
}

h4 {
	font-size: 130%;
	margin: 2px 0 10px 0;
	color: #004470;
}

h5 {
	font-size: 120%;
	margin: 0 0 7px 0; 
}

h6 {
	font-size: 110%;
	margin: 0 0 5px 0;
	color: #004470;
}

/* -------------------- Content --------------------*/

p {
	margin-top: 5px;
	margin-bottom: 15px;
}

aside p {
	font-size:90%;
}

footer p {
	margin:0;
	line-height: 130%;
}

strong {
	font-weight: bold;
}

.faculty-directory p {
	min-height: 132px;
}

/* -------------------- Tables --------------------*/

table {
	margin: 10px 0 17px 0;
	border-collapse:collapse;
}

table, td, th {border: 1px solid #CD5E0A;}

th {
	color: #fff;
	background-color: #CD5E0A;
}

td, th {padding: 5px;}

/* -------------------- Blockquotes --------------------*/
blockquote {
	background-color: #F1EADA;
	color: #CD5E0A;
	margin: 15px 35px 17px 35px;
	border-left: 4px solid #004470;
	padding: 10px;
	font-size: 150%;
	line-height: 120%;
	font-family: Georgia, "Times New Roman", Times, "New York", serif;
	font-style: italic;
}
/* -------------------- Lists --------------------*/
#wrapper ol {
	margin-left: 30px;
	line-height: 160%;
	margin-bottom: 10px;
	list-style-type: decimal;
}

#wrapper  ul {
	margin-left: 30px;
	line-height: 160%;
	margin-bottom: 10px;
	list-style-type: square;
}

#wrapper  li ul {list-style-type: circle;}
#wrapper  li li ul {list-style-type: disc;}
#wrapper  li ol {list-style-type: lower-alpha;}
#wrapper  li li ol {list-style-type: lower-roman;}

/* -------------------- Less Common Markup --------------------*/
.underline {text-decoration:underline;}
#wrapper dl {margin: 10px 0 17px 0;}
#wrapper dt {font-weight: bold;}
#wrapper dd {margin: 5px 0 17px 15px; line-height: 140%; margin-bottom: 15px;}
#wrapper strong {font-weight:bold;}
#wrapper em {font-style: italic;}
#wrapper sup {font-size: 75%;vertical-align: super;}
#wrapper sub {font-size: 75%;vertical-align: sub;}
#wrapper cite {font-style: italic;}
#wrapper abbr {border-bottom: 1px dotted #CD5E0A;}
#wrapper del {text-decoration: line-through;}
#wrapper ins {color: #CD5E0A;text-decoration: underline;}

#wrapper pre {
	font-family: monospace;
	font-size: 100%;
	margin: 10px 0 10px 0;
	line-height: 100%;
}

#wrapper code {
	background-color: #F1EADA;
	font-family: monospace;
	font-size: 100%;
	white-space:pre;
	display: block;
	margin: 10px;
	padding: 5px;
	border-left: 4px solid #004470;
	line-height: 100%;
}

#wrapper var {
	font-weight:bold;
	font-style:italic;
	font-family: "Times New Roman", Times, serif;
}

hr {
	height: 1px;
	color: #004470;
	background-color: #004470;
	margin: 15px 0 15px 0;
	border:0;
}

/* --------------------Captions-----------------*/
p.caption {
	font-weight:bold;
	font-size:80%;
	margin-top:-2px;
	line-height:110%;
}

/* ------------------------------------------------------
   Images
	 ------------------------------------------------------*/

#footer-image {
	float:right;
	max-width:30%;
}

img.alignright {
	float: right;
	margin-left: 10px;
	margin-bottom: 10px;
}

img.alignleft {
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	font-size: 24px;
}

img {
	max-width: 100%;
	height: auto;
}

/* ------------------------------------------------------
   Links
	 ------------------------------------------------------*/

#wrapper a, #wrapper a:visited {
	color: #CD5E0A;
	text-decoration: underline;
}

#wrapper a:hover, #wrapper a:active {
	color: #BC2332;
}

#wrapper footer a, #wrapper footer a:visited {
	text-decoration: none;
	color: #efefef;
}

#wrapper footer a:hover, #wrapper footer a:active {
	text-decoration: underline;
	color: #efefef;
}

#wrapper div#credit a, #wrapper div#credit a:visited {
	color: #00447c;
	text-decoration: none;
}
#wrapper div#credit a:hover, #wrapper div#credit a:active {
	text-decoration: underline;
}

/* ------------------------------------------------------
   Main Navigation
	 ------------------------------------------------------*/

nav {
	display: table;
	width: 100%;
	height: 30px/
	min-width: 768px;
	background: #CD5E0A;
	font-size: 100%;
	font-family: Arial, sans-serif;
	position: relative;
}

nav > ul {
	padding: 0;
	margin: 0 auto;
	max-width: 990px;
	min-width: 768px;
	width: 97%;
	margin: 0 auto 0 auto;
}

nav li {
	display: table-cell;
    height: 30px;
    width: 20%;  
    text-align: center;
background: #CD5E0A;
    border-right: 1px solid #CD5E0A;
    white-space: nowrap;
}


nav > ul > li > ul {
  display:none;
  position: relative;
	width: 200px;
	background-color: #CD5E0A;
}

nav > ul > li:hover > ul {
  display:block;
}

nav ul li ul li {
	float:none;
	display:block;
}

.clearnav:before,
.clearnav:after {
	content: " ";
	display: table;
}

.clearnav:after {
	clear: both;
}

nav a {
	background: #CD5E0A;
	color: #fff;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	line-height: 30px;
	padding-left:10px;
	padding-right:10px;
}

nav > ul > li > a {
	border-right: 1px solid #BE5709;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

	nav > ul > li:first-child a {
	border-left: 1px solid #BE5709;
}

nav a:hover, nav a:active {
	background-color: #004470;
}

nav a#pull {
	display: none;
}

/* ------------------------------------------------------
   Media Queries
	 ------------------------------------------------------*/

/* If screen is thin, make frontpic only half size; */
@media only screen and (max-width: 980px) {
	#front-pic, #front-first {
		width:48.5%;padding-left:0.5%;
	}
	#front-pic {
		padding-right:0.5%
	}
}




/*  Aimed at smartphone sizes  */
@media only screen and (max-width: 767px) {

	body {background-color: #fff;background-image: none;}
	header#page-header {
		min-width:200px;display:none;}
	header#mobile-page-header {
			display:block;max-width: 100%;width: 100%;min-width:200px;text-align:center}
	#front-first {padding:0;}
	#front-pic{
			padding-top:0;padding-left:0;padding-right:0;width: 100%;margin: 0;float: none;clear: both;}
	#front-image{
			margin-top: -18px;margin-bottom: 10px;padding-top:0;border-top:1px solid #666;max-width: 100%;min-width: 100%;}
	.content-third:first-child, #front-first, .content-third:nth-child(2), .content-third:last-child {
			width: 100%;float: none;clear: both;margin: 0;
		}
	#content-full, aside, #content-wide, #front-first, .content-third:last-child, .content-third:first-child, 	.content-third:nth-child(2)  {
			width: 90%;padding:0;float: none;clear:both;margin: 0 auto 0 auto;}
	#content-wide, #front-first, .content-third:first-child, .content-third:nth-child(2) {
			border-bottom: 1px dotted #006699;padding-bottom: 4px;margin-bottom: 15px;}
	.content-third img, .content-third:last-child img {
		width:100% !important; max-width: 100% !important;}
	#wrapper {
			min-width: 200px;max-width: 100%;width:100%;background-color: #fff;
			background-image: none;padding: 0 0 10px 0;font-size: 130%;	}
	nav {
			width:100%;background-color: #fff;background-image: none;padding: 0 0 10px 0;
			font-size: 130%;margin-top:-12px;margin-bottom: 18px;border-top: 1px solid #004470;
			min-width:2px;max-width: 100%;border-bottom: 0;}
	nav ul {
			width: 100%;display: none;height: auto;min-width: 20px;}
	nav li {width: 100%;}
	nav a {
			background-color: #F58026;padding:5px 0 5px 0;width: 100%;
			max-width: 100%;min-width:2px;text-align: left;text-indent: 20px;}
	nav a#pull {
			display: block;background-color: #004470;width: 100%;position: relative;}
	nav a#pull:after {
			content:"";width: 30px;height: 30px;display: inline-block;position: absolute;right: 15px;top: 10px;}
	nav > ul > li > ul {position: static; width: 95%; padding-left:5%; }


	#front-bottom {width: 100%;padding:0;margin:0;}
	footer, #credit {font-size: 70%;	}
	footer {width: 100%;padding: 10px 0 10px 0;margin-top: 15px;background-color: #006699;color: #efefef;
		clear:both;text-align:center;}
	#credit {line-height: 110%;	}
	h1 {font-size: 130%;}
	h2 {font-size: 125%;}
	h3 {font-size: 120%;}
	h4 {font-size: 115%;}
	h5 {font-size: 110%;}
	h6 {font-size: 105%;}

}

@media only screen and (max-width : 320px) {

	nav li {
		display: block;
		float: none;
		width: 100%;
	}

	nav li a {
		border-bottom: 1px solid #0077aa;
	}
}
<TITLE>Research</TITLE>
