@import url("https://www.otago.ac.nz/css/reset.css");
@import url("https://www.otago.ac.nz/css/icons.css");
@import url("https://www.otago.ac.nz/css/960.css");
@import url("https://www.otago.ac.nz/css/text.css");

/***** FORGING A MAGICAL LANDSCAPE WEBSITE ******************************/

body { z-index: 0; margin: 0; padding: 0; background-color: #fff; font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 76%; line-height: 1.5em; color: #333333; background-image: url(../gfx/background-repeat.gif); background-repeat: repeat-x; }
strong { font-weight: bold; }
em { font-style: italic; }
.clearall { clear: both !important; }
a[href$=".pdf"] { padding-left: 1.7em; }

hr { border-bottom: 8px solid #00aeef; border-top: 1px solid #94cfea; border-left: none; border-right: none; margin-top: 0em; margin-bottom: 2.0em; padding-bottom: 0.2em; }
blockquote { background-image: url(../gfx/quote-marks.png); background-repeat: no-repeat; margin: 0 0 1.0em 2.0em; padding: 0 1.0em 1.0em 1.2em; font-size: 1.3em; font-family: Georgia, "Times New Roman", Times, serif; border-right: 5px solid #e4e4e4; font-style: italic; color: #666666; }

/****** HEADER ************************/

#header { background-image: url(../gfx/header-background.jpg); background-repeat: no-repeat; height: 211px; margin-bottom: 0.1em; background-position: right; }
#header .otagologo { }

#unilogo { margin-top: 5.0em }
#title { margin-top: 0em; margin-left: 0.7em; }

#subtitle-line { }

.subtitle { margin-left: 11.0em; vertical-align: top; margin-top: 0.6em; }
.exhibition-date { margin-left: 19.0em; vertical-align: top; margin-top: 0.9em; }


/****** HEADING AND NAVIGATION ************************/

#heading-line { margin: 1.5em 0 0 0; height: 54px; }

#left-icon { padding: 3.3em 0em 0em 0em; }
#left-icon .prev { background-image: url(../gfx/navigation-buttons-circle.png); background-repeat: no-repeat;  margin: 2.8em 0em 0em 0em; padding: 2.8em 0em 0em 0em; text-align: left; font-weight: bold; font-size: 1.2em; text-transform: uppercase; background-position: 6px 0; display: inline; }
#left-icon .prev:hover { background-position: 6px -62px; }
#left-icon .prev a { color: #336699; padding: 3.0em 0em 0em 0em; text-decoration: none; }
#left-icon .prev a:hover { color: #003366; border-bottom: 1px solid #999999; text-decoration: none; }

#heading-one { }
#heading-one h1 { font-size: 2.6em; color: #555555; line-height: 1.1em; margin: 0em 0em 0.4em 0.9em; padding: 0.3em 0em 0.3em 0.5em; font-weight: normal; letter-spacing: -0.02em; background-image: url(../gfx/heading-one-stroke.png); background-repeat: no-repeat; background-position: bottom; font-family: Helvetica, Arial, sans-serif; font-weight: bold; }

#right-icon { padding: 3.3em 0em 0em 0em; }
#right-icon .next { background-image: url(../gfx/navigation-buttons-circle.png); background-repeat: no-repeat; background-position: center top; font-weight: bold; font-size: 1.2em; text-transform: uppercase; margin: 0em 0em 0em 0em; padding: 2.8em 0em 0em 0em; background-position: -130px 0; display: inline; }
#right-icon .next:hover { background-position: -130px -62px; }
#right-icon .next a { color: #336699; padding: 3.0em 0em 0em 0em; text-decoration: none; }
#right-icon .next a:hover { color: #003366; border-bottom: 1px solid #999999; text-decoration: none; }



/****** CONTENT ************************/

#content { }

#content p { font-size: 1.1em; line-height: 1.6em; color: #333333; padding: 0em 0em 1.5em 2.0em; margin: 0em; font-family: Verdana, Geneva, sans-serif; }

#content img { padding: 0em 0em 0em 0em; margin: 0em 0em 0em 0em; }

#content h1 { font-size: 2.6em; color: #555555; line-height: 1.1em; margin: 0.4em 0em 0.4em 0.9em; padding: 0.4em 0em 0.3em 0em; font-weight: normal; letter-spacing: -0.02em; background-image: url(../gfx/heading-one-stroke.png); background-repeat: no-repeat; background-position: bottom; font-family: Helvetica, Arial, sans-serif; font-weight: bold; }
#content h2 { font-size: 1.7em; color: #444444; line-height: 1.4em; margin: 0em; padding: 0em 0em 0.5em 1.3em; }
#content h3 { font-size: 1.3em; color: #666666; line-height: 1.5em; font-weight: bold; margin: 0em; padding: 0em 0em 0.2em 0em; }
#content h4 { font-size: 1.0em; color: #333333; line-height: 1.5em; margin: 0em; padding: 0em; }
#content h5 { font-size: 1.0em; color: #333333; line-height: 1.5em; margin: 0em; padding: 0em; font-style: italic; }
#content h6 {}

#content a { color: #336699; text-decoration: none; -webkit-transition: all .2s ease-in-out; }
#content a:hover { color: #003399; text-decoration: underline; }
#content a img { border: none; }
#content a img:hover { border: none; }

#content ul { list-style-type: circle; color: #333333; margin: 0.5em 0em 1.0em 2.0em; padding: 0em; }
#content ol { color: #4f4f4f; padding: 0em; margin: 0em 0em 1.0em 2.5em; }
#content li { margin: 0em; padding: 0em 0em 0.5em 0em; }
#content li a { color: #336699; text-decoration: none; }
#content li a:hover { color: #003399; text-decoration: underline; }
#content ul li {}
#content ul li ul {}
#content ul li ul li {}

#content table { padding: 0em; margin: 0em 0em 1.5em 0em; width: 470px; border-collapse: collapse; font-size: 1.0em; }
#content tr { padding: 0em; margin: 0em; }
#content th { padding: 1.0em 0em 1.0em 0.5em; margin: 0em; background-color: #e4e4e4; text-align: left; border: 1px solid #cccccc; color: #666666; }
#content td { padding: 0.5em; margin: 0em; color: #333333; vertical-align: top; border: 1px solid #e4e4e4; border-collapse: collapse; }

#content td h1 {}
#content td p {}
#content td ul {}
#content td li {}

#content hr.end-content { margin-top: 2.0em; margin-left: 2.0em; margin-bottom: 0em; }

/* Classes */
#content .topofpage { color:#999999; text-align: right; font-size: 0.9em; margin: 0em 0em 0em 0em; padding: 0em; }
#content .topofpage p {  }

#breadcrumbs { font-size: 0.9em; } 
#breadcrumbs p { margin: 0em; padding: 0em; color: #999999; }

#content .note { color: #666666; font-size: 1.0em; padding-left: 2.3em; }

#content img.thumbnail { background-image: url(../gfx/thumbnail-shadow.jpg); background-position: bottom; background-repeat: no-repeat; padding-bottom: 1.2em; padding-right: 20px; margin-bottom: 0.5em; }

#content .textright { padding-left: 33.3em; color: #796653; font-size: 0.9em; }

#content img.nomarginright { margin-right: 0em; padding-right: 0em; }

#content .reference { color: #777777; font-size: 1.0em; border-top: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9; background-color: #f9f9f9; margin: 0 3.0em 2.0em 0em; padding: 0.5em 0.8em 1.5em 0.8em; }

/* NEXT, PREV & HOME NAVIGATION */
#content .home { background-image: url(../gfx/navigation-buttons.png); background-repeat: no-repeat; background-position: center top; margin: 0em 0em 0em 0em; padding: 3.0em 0em 0em 0em; text-align: center; font-weight: bold; font-size: 1.2em; text-transform: uppercase; font-family: Georgia, "Times New Roman", Times, serif; }
#content .home:hover { background-position: -35px -70px; }
#content .home a { color: #f15b22; padding: 3.0em 0em 0em 0em; }
#content .home a:hover { color: #336699; border-bottom: 1px solid #999999; text-decoration: none; }

/*--Column Styles--*/
#content .column-1 { margin: 0em 1.5em 2.0em 2.4em; padding: 0em; float: left; width: 266px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #f1f1f1; }
#content .column-1 img { float: left; padding: 0.5em; } 
#content .column-1 p { color: #666666; padding: 0.2em 0.5em 1.5em 15.7em; font-size: 0.9em; }

#content .column-2 { margin: 0em 0em 2.0em 0; float: left; width: 266px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #f1f1f1; }
#content .column-2 img { float: left; padding: 0.5em; } 
#content .column-2 p { color: #666666; padding: 0.2em 0.5em 1.5em 15.7em; font-size: 0.9em; }

#content .column-1-special { margin: 0em 1.5em 2.0em 2.4em; padding: 0em; float: left; width: 266px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #f1f1f1; }
#content .column-1-special img { float: left; padding: 0.5em; } 
#content .column-1-special p { color: #666666; padding: 0.2em 0.5em 1.5em 0.7em; font-size: 0.9em; }

#content .column-2-special { margin: 0em 0em 2.0em 0; float: left; width: 266px; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; background-color: #f1f1f1; }
#content .column-2-special img { float: left; padding: 0.5em; } 
#content .column-2-special p { color: #666666; padding: 0.2em 0.5em 1.5em 0.7em; font-size: 0.9em; }

/* Styles the image preview boxes */
#content .information { margin-right: 1.4em; }
#content p.information { color: #6b5a49; font-weight: normal; padding-top: 0.5em; padding-bottom: 0.5em; border-top: 4px solid #d8ae46; font-family: Georgia, "Times New Roman", Times, serif; }
#content .informationright { margin-right: 0em; }
#content p.informationright { color: #796653; font-weight: normal; padding-top: 0.5em; padding-bottom: 0.5em; border-top: 4px solid #d8ae46; font-family: Georgia, "Times New Roman", Times, serif; }

/* Styles feature image if used */
#content .featureimage { float: left; width: 340px; margin: 0 2.0em 0 0; background: none !important; }
#content .featureimage p { margin: 0 0 1.0em 0; }
/* Hides other images when js is turned off*/
#slider .featureimage { display: none; background: none !important; }
#slider #first { display: block; }

.featureimage { }

.text-columns { -moz-column-width: 400px; -webkit-column-width: 400px; -moz-column-gap: 2.0em; -webkit-column-gap: 1.0em; columns: 2 400px; margin-bottom: 2.0em; }

/* Slider styling */
#slider { float: left; margin: 0px 2em 0px 0px; }

#content .frontpage { margin-right: 0.9em; margin-bottom: 1.0em; padding-bottom: 0em; border: 1px solid #796653; }
#content .frontpage:hover { border: 1px solid #ffefa2; }
#content .frontpage img { padding: 0; margin: 0em; } 

#content .thumbnailgrid { margin-right: 1.1em; border: 1px solid #999999; }

#content .portrait { padding-left: 2.0em; padding-bottom: 1.0em; }

/****** FRONTPAGE STYLES ******************************/

#front-content h1 { font-size: 2.6em; color: #555555; line-height: 1.1em; margin: 0.4em 0em 0.4em 0em; padding: 0.4em 0em 0.3em 0em; font-weight: normal; letter-spacing: -0.02em; background-image: url(../gfx/heading-one-stroke.png); background-repeat: no-repeat; background-position: bottom; font-family: Helvetica, Arial, sans-serif; font-weight: bold; }
#front-content a { color: #003366; }
#front-content a:hover { color: #003399; }
	
#front-content div.columns { width: 940px; margin: 0 auto; padding: 0; }
#front-content div.columns div { float: left; width: 168px; margin: 0em 1.6em 1.2em 0em; padding: 0; position: relative; }
#front-content div.columns div a { display: block; text-decoration: none; }
#front-content div.columns div a:hover { z-index: 10; }
/*--Thumbnail Styles--*/
#front-content div.columns div a img { position: relative; background-image: url(../gfx/thumbnail-shadow.jpg); background-position: bottom; background-repeat: no-repeat; padding-bottom: 16px;border: 1px solid #cccccc; padding-bottom: 0em; }
#front-content div.columns div a:hover img { background-image: none; z-index: 10; }
#front-content div.columns div a .info { position: absolute; left: -10px; top: -10px; padding: 8.0em 10px 20px; width: 162px; display: none; background: #00aeef; font-size: 1.2em; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; z-index: 110; color: #000; }
#front-content div.columns div a:hover .info { z-index: 5; display: block; border: 1px solid #008bc0; }
#front-content div.columns div a h2 { font-size: 0.9em; font-weight: bold; text-transform: uppercase; margin: 0; padding: 0.5em 0 0.2em 0; color: #fff; line-height: 1.2em; }
#front-content div.columns div a p { padding: 0; margin: 0; font-size: 0.9em; line-height: 1.4em; }


/****** RIGHT-COLUMN ************************/

#right-column { margin: 0.4em 0 0 0; }
#right-column hr { margin: 8px 0 30px 0; padding-bottom: 2px; }

#right-column .prev { background-image: url(../gfx/navigation-buttons-circle.png); background-repeat: no-repeat;  margin: 0em 6.9em 0em 5.0em; padding: 2.8em 0em 0em 0em; text-align: left; font-weight: bold; font-size: 1.2em; text-transform: uppercase; background-position: 6px 0; display: inline; }
#right-column .prev:hover { background-position: 6px -62px; }
#right-column .prev a { color: #336699; padding: 3.0em 0em 0em 0em; text-decoration: none; }
#right-column .prev a:hover { color: #003366; border-bottom: 1px solid #999999; text-decoration: none; }

#right-column .next { background-image: url(../gfx/navigation-buttons-circle.png); background-repeat: no-repeat; background-position: center top; font-weight: bold; font-size: 1.2em; text-transform: uppercase; margin: 0em 0em 0em 0em; padding: 2.8em 0em 0em 0em; background-position: -130px 0; display: inline; }
#right-column .next:hover { background-position: -130px -62px; }
#right-column .next a { color: #336699; padding: 3.0em 0em 0em 0em; text-decoration: none; }
#right-column .next a:hover { color: #003366; border-bottom: 1px solid #999999; text-decoration: none; }

#right-column .thumbnail-left { margin-right: 1.6em; }
#right-column .reference { line-height: 1.5em; color: #777777; font-size: 1.0em; border-top: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9; background-color: #f9f9f9; margin: 0 0 2.0em 0em; padding: 0.5em 0.5em 1.5em 0.5em; }


/****** FOOTER ************************/

#footer { font-size: 0.9em; color: #ffffff; padding-top: 1.5em; padding-bottom: 5.0em; margin-top: 2.0em; background-color: /*#00aeef*/#000; border-top: 10px solid #00aeef; }
#footer a { color: #ffffff; text-decoration: none; }
#footer a:hover { color: #e1e1e1; }

#disclaimer { font-size: 1.0em; color: #ffffff; }
#disclaimer a { color: #f5f5f5; text-decoration: none; }
#disclaimer a:hover { color: #e1e1e1; }

.weboffice { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 0.9em; line-height: 1.3em; color: #f1f1f1; padding-top: 0em; text-align: right; }
.weboffice p { }
.weboffice a { font-weight: bold; color: #ffffff; text-decoration: none; letter-spacing: 0.07em; }
.weboffice a:hover { text-decoration: underline; color: #e1e1e1; }