﻿@charset "utf-8";
/* CSS Document */

/* reset */
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, font, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;	padding: 0;	border: 0;	outline: 0;	font-size: 100%; vertical-align: baseline; background: transparent;}

* {
  margin: 0;
  padding: 0;
}

html,body {height:100%;}

html {overflow-y:scroll;}

body {
	color:#333;
	background:url(./image/header_UA4.png) repeat-x;
	background-color: #fff;
	font-size: 14px;
	font-family: Helvetica, sans-serif; font-weight:normal;
	color: #555;
	line-height: 150%;

}
ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}
/* remember to define focus styles! */
:focus {outline: 0;}
/* reset END */

/* Type styles & float styles etc. */
h1 {font-family: Helvetica, sans-serif;  font-size: 22px; line-height: 190%; color: #dc7714; font-weight:normal;}
h2 {font-family: Helvetica, sans-serif;  font-size: 18px; line-height: 150%; color: #1A5276; padding: 10px 0 8px 0; font-weight:normal;}
h2x {font-family: Helvetica, sans-serif;  font-size: 20px; line-height: 100%; color: #dc7714; padding: 10px 0 8px 0;}
h2y {font-family: Helvetica, sans-serif;  font-size: 18px; line-height: 100%; color: #dc7714; padding: 10px 0 8px 0;}
h3 {font-family: Helvetica, sans-serif;  font-size: 15px; line-height: 190%; color: #1F618D; font-weight:normal;}
h4 {font-family: Helvetica, sans-serif;  font-size: 14px;  color: #666; font-weight:normal;}
.date {font-size:small; Helvetica, sans-serif; color: #d09b32; }
a { text-decoration:none;color:#252F33;}
p {margin-bottom: 10px; line-height: 1.6em;}

/* img { margin: 0 20px 0px 0; width: 108px; height: 150px;}  */

.clear {clear: both;}
.pix-border {border: 1px solid;}
.pix-padding {padding: 3px;}
.fltrt {float: right; margin-left: 8px;}
.fltlft {float: left; margin-right: 8px;}
#images-container-right {clear:both; font-size:11px; color: #000; line-height:150%; padding: 5px 0 0 19px;}
#images-container-right-news {clear:both; font-size:11px; color: #000; line-height:150%; padding: 0px 0 -10px 19px;}
#images-container-left {clear:both; font-size:11px; color: #000; line-height:150%; padding: 5px 19px 0 0;}

/*bulleted list*/
#content ol, #content ul, #content li {list-style: disc; margin-left: 15px; margin-bottom: 10px;}


/* Main styles */
#container {width:1100px; padding:0px; margin:0 auto;  min-height:100%;}
#container2{width: 750px;float: left; font-size:18px;line-height: 180%;}
#floated{float: left;}
#text{width: 1000px; font-size:18px;line-height: 180%; text-align:left;}
#content-main {width:100%;  overflow: auto; padding-bottom:180px;   /* Height of the footer */}
#content-main2 {width:940px;  overflow: auto; padding-bottom:180px;  margin: 10px 0px 0px 73px; float: left  /* Height of the footer */}

/*the most top place, where UA logo is located*/
#header {top: 19px; left: 13px;}
#header2 {position:relative;height:120px;width: 100%;padding: 20px 0px 0px 0px;}

a {color: #5499C7;}

.title {position:relative;left:300px;top:7px; text-align:left;font-family:Helvetica, "Times New Roman", Times, serif; font-size:30px;font-weight:bold; color:#ffffff;}
.subText {position:relative;left:145px;top:35px;text-align:left;font-family:Helvetica, "Times New Roman", Times, serif;font-size:35px;font-weight:bold;color:#ffffff;}
.subText1 {position:relative;right:205px;top:60px;text-align:right;font-family:Helvetica, fantasy, Georgia, Arial, Helvetica, "Times New Roman", Times, serif;font-size:20px; color:#ffffff;}
.subText2 {position:relative;right:205px;top:47px;text-align:right;font-family:Helvetica, "Times New Roman", Times, serif;font-size:18px; font-style:italic; color:#ffe4b5;}
/*.subText1 {position:relative;left:545px;top:60px;text-align:left;font-family:Helvetica, fantasy, Georgia, Arial, Helvetica, "Times New Roman", Times, serif;font-size:20px; color:#ffffff;}
.subText2 {position:relative;left:345px;top:47px;text-align:left;font-family:Helvetica, "Times New Roman", Times, serif;font-size:18px; font-style:italic; color:#ffe4b5;}*/
.articleTitle {text-align:left;float: left; width: 940px; color: #CA0033;margin: 10px 0px 10px 0px; padding: 0px 20px 0px 0px; font-family:Helvetica, sans-serif;font-size:22px;font-weight:bold;}
.articleTitle2 {text-align:left;padding-left:0px;padding-top:0px;padding-bottom:0px;color: #CA0033;font-family:Verdana, Arial, Helvetica, sans-serif;font-size:22px;font-weight:bold;}
.articleContent {width:auto; position:relative; padding-left:0px; color:#333333; text-align:left; font-family:Arial, Helvetica, sans-serif; line-height:27px;}
.rightLinks {width: 202px;font-size:18px;line-height:180%;height:auto;margin-right:-3px;margin-bottom:10px;background-image:;background-repeat:no-repeat;text-align:right;float:right;}
.rightLinks a:hover{color:#003366;}
.rightLinks .linkTitle {font-size:20px;font-weight:bold;margin-top:10px;margin-bottom:32px;margin-right:1px;color:#CC0033;}


/* Homepage styles */
#page {margin: 0 auto 0 auto; display: table; height: 100%;  position: relative; overflow: hidden;  width: 1024px;/*background: #252F33 url(background.png) repeat-y;*/}
#pageContent { width: 1024px; height:auto; padding-bottom:20px;}
#image-rotate {float: left; width: 940px; margin: 0px 0px 0px 73px; padding: 0px 0px 10px 0px; text-align:left;}

#welcome {float: left; width: 940px; margin: 10px 0px 0px 73px; padding: 0px 20px 0px 0px; text-align:left;}
#welcome2 {float: left; width: 940px; margin: -20px 0px 0px 73px; padding: 0px 20px 0px 0px; text-align:left;}
#welcome img {float: left; border: 1px solid; margin: 7px 15px 5px 0px;}
#highlights {float: left; width: 460px; text-align:left; margin: 10px 10px 10px 73px;}
#highlights ul {text-align:left; list-style:url(../graphics/body/arrow.jpg);}
#highlights li {margin-left:15px;}
#highlights img {float: left; border: 1px solid; margin: 7px 15px 5px 0px;}
#introduction{float: left; width:700px;}
#introduction img {margin: 0 20px 0px 0; width: 108px; height: 150px;} 


/* Homepage News section */
#news {float: left; width: 460px; text-align:left; margin: 10px 10px 12px 10px;}
#news ul {text-align:left; list-style:url(../graphics/body/arrow.jpg);}
#news li {margin-left:20px;}
#news li a {color: #5499C7;}
#news li a:hover {background: url(../graphics/body/arrow-submenu.jpg) no-repeat left; text-decoration:underline;}

/* navigation */
div#nav-bar {float: left; text-align: left; margin-left: 10px;}
#nav-main {font-size: 18px; height: 59px; padding: 27px 0 0px 10px; font-family: Helvetica, sans-serif}
#nav-main li {position:inherit; display: inline; color: #fff; padding: 5px;}
/* #nav-main li.selected a { background: #1f5158; height: 20px; padding: 17px 15px 15px 12px;}
#nav-main a:link, #nav-main a:visited, #nav-main a:active {color: #fff; text-decoration: none; letter-spacing:1px; margin: 19px 0px 0px 30px; padding: 17px 15px 15px 12px;}
#nav-main a:hover {color: #fff; background-color:#1f5158; padding: 17px 15px 15px 12px; } */
#nav-main li.selected a {background: #003366; padding-top:15px;padding-bottom:15px}
#nav-main a:link, #nav-main a:visited, #nav-main a:active {color: #fff; text-decoration: none; letter-spacing:1px; margin: 19px 0px 0px 30px; padding: 17px 15px 15px 12px}
#nav-main a:hover {color: #fff; background-color:#003366; }

/* footer */
#footer-container {background: #e7e7e7;   position:relative;   margin-top: -180px; /* negative value of footer height */ height: 180px; clear: both; width:100%;}

#footer {background: #e7e7e7; margin:0 auto; padding: 30px; height: 50px; width: 960px;}
#footer2 {background: #e7e7e7; margin:0 auto; padding: 0 30px 30px 30px; height: 150px; width: 960px;}

#footer-container-right {float: right; width: 350px;}
#footer-container-left {float: left; width: 350px; }
#footer-container-eas {float: left; width: 45px; margin-top: 5px;}
#UA-logo {float: right; margin-right: 10px; margin-bottom: 6px;}
#copyright {float: right; margin-right: 10px;}
#mce {float: left;}
#eas {float: left; margin-bottom: 3px;}
#social {float: left; margin-right: 10px;}

/* footer links */
#footer-container a {color: #1F618D;}
#footer-container a:link, #footer-container a:visited {text-decoration:none;}
#footer-container a:hover, #footer-container a:active {text-decoration:underline;}

/* Subpage styles */
#content {float: right; width: 750px; margin: 10px 50px 0 0;   padding-bottom:50px;   /* Height of the footer */}
#sub-container {float:left; width: 200px; padding: 52px 0 20px 70px;}

ul#sub-nav {padding:0;margin:0;}
ul#sub-nav li {list-style:none; line-height:2em; border-top: 1px solid #CCC; width:190px; }
ul#sub-nav li a {
  padding-left: 15px;
  color:#0098C0;
  background:#FFFFFF;
  text-decoration:none;
  display:block;
  padding:5px;
}
ul#sub-nav li a:hover {
  background-color: #efeeee; color:#1f5158; 
}
ul#sub-nav li:last-child {border-bottom: 1px solid #CCC;}


/* Gallery */
#welcome {float: left; width: 940px; margin: 10px 0px 0px 73px; padding: 0px 20px 0px 0px; text-align:left;}

/* People */
div.people {clear:both; border-top:1px solid #e1e1e1; padding-top:8px;}
#content .people img {float: left; margin: 2px 10px 4px 0px; }
#content .people p {margin-left:119px; }
#content-main2 .people img {float: left; margin: 2px 10px 4px 0px; }
#content-main2 .people p {margin-left:119px; }
#members {border-top:1px solid #e1e1e1; padding-top:8px; width: 185px; float: left;}

/* Contact */
div.contact {clear:both; padding-top:8px;}
#content .contact img {float: left; margin: 2px 10px 4px 0px; }
#content .contact p {margin-left:119px; }


/* Research */
#research-container {clear:both; border-bottom:1px solid #e1e1e1; margin-bottom:20px;}

/* Resources */
/* videos */
#videocol1 {width: 300px; float:left; font-size:11px; color: #000; line-height:150%;}
#videocol2 {width: 300px; float:left; padding: 0 0 0 35px; font-size:11px; color: #000; line-height:150%;}
div.video {clear:both; padding-top:8px;}
#content .video {width: 300px; padding-bottom: 10px;}
#content .video img {float: left; margin: 2px 10px 10px 0px; }
#content .video p {margin-left:119px; }

/* Publications */
#content .ep_view_jump_to {font-size:10px;}
#content .ep_view_blurb {font-size:10px;}


/* carousel */
.carousel{
	position:relative;
}
.carousel h2{
	background:none;
	padding:0;
	position:relative;
}
.carousel-holder ul{
	position:relative;
	margin:0;
	padding:0;
	list-style:none;
}
.carousel-holder ul li img{
	display:block;
}

/* slideshow*/
#slideshow div.carousel div.carousel-holder img {border: 4px solid white;padding:0;}
#slideshow {	
	width:960px;
	float:left;
}
#slideshow .carousel-holder{
	width:960px;
	height:200px;
}
#slideshow .carousel-holder ul{
	width:960px;
	height:200px;
	float:left;
}
#slideshow .carousel h2{
	margin:0 0 0px 0px;
}
#slideshow .carousel-holder ul li{
	position:absolute;
	top:0;
	left:0;
	width:960px;
}
#slideshow .carousel-holder ul li span{float:left;}
#slideshow .carousel-holder ul li img{
	margin:0 0 0px;
}



/*
#footer { width: 100%;   font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, serif;   font-size: 100%;   height: 80px;
  padding: 28px 0 5px 0;  text-align: center; background: #CC0033;  border-top: 2px solid #E7746F;  color: #FFF;}
#footer p { padding: 0 0 20px 0;line-height: 1.7em; position:relative; text-align:center; font-family:Helvetica, "Times New Roman", Times, serif;
	color:#ffffff;}
#footer a { color: #ffffff; text-decoration: none;}
#footer a:hover { color: #FFF; text-decoration: none;}
*/


/* Slideshow container */
.slideshow-container { max-width: 738px; position: relative; margin: auto;}
/* Next & previous buttons */
.prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: white; font-weight: bold;
  font-size: 18px; background-color:none; /*#CC0033;*/ transition: 0.6s ease; border-radius: 50%; }
/* Position the "next button" to the right */
.next {  right: 0;  border-radius: 50%;  border-color: white;}
/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {  background-color: #CC0033; /*rgba(0,0,0,0.8);*/ }
/* Caption text */
.text {  color: #003366; font-weight: bold;  font-size: 15px;  padding: 8px 12px;  position: absolute;  bottom: 8px;  width: 100%;
  text-align: center;  background-image:url(..images/banner-background02.jpg) repeat;  left: 0px;  right: 0px;/*background-color: #003366;*/}
.bottomright_text {  color: #ffffff;  font-weight: bold;  font-size: 15px;  position: absolute; bottom: 16px; right: 4px; left: 30em;}
.shadow {background:url(/images/banner-background02.jpg) repeat;left: 0px; width: 100%; height: 55px; text-align: left; bottom: 0px; display: block; position: absolute; z-index: 10;}
.shadow a { left: 50%; width: 800px; height: 55px; color: rgb(255, 255, 255); line-height: 55px; overflow: hidden; font-family: Helvetica, "Times New Roman", Times, serif; font-size: 24px; text-decoration: none; margin-left: -495px; display: inline-block; position: absolute;}
/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {  cursor:pointer;  height: 13px;  width: 13px;  margin: 0 2px;  background-color: #bbb;  border-radius: 50%;  display: inline-block;
  transition: background-color 0.6s ease;}
.active, .dot:hover {  background-color: #717171;}


/* tab text */
.tab { margin-left: 40px; }







