/*! Generated by Fontspring (https://www.fontspring.com) on August 27, 2018. Fully installable fonts can be purchased at http://www.fontspring.com. The fonts included in this stylesheet are subject to the End User License you purchased from Fontspring. The fonts are protected under domestic and international trademark and copyright law. You are prohibited from modifying, reverse engineering, duplicating, or distributing this font software. (c) 2010-2018 Fontspring */
@font-face { font-family: 'Amsi pro condlight'; src: url(/_assets/_fonts/amsipro/amsiprocond-light-webfont.woff2) format('woff2'), url(/_assets/_fonts/amsipro/amsiprocond-light-webfont.woff) format('woff'); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'Amsi pro condbold'; src: local('Amsi pro condbold'), local('Amsi-pro-condbold'), url(/_assets/_fonts/amsipro/amsiprocond-bold-webfont.woff2) format('woff2'), url(/_assets/_fonts/amsipro/amsiprocond-bold-webfont.woff) format('woff'); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local('Open Sans Regular'), local('OpenSans-Regular'), url(/_assets/_fonts/opensans/opensans-regular.woff2) format('woff2'), url(/_assets/_fonts/opensans/opensans-regular.woff) format('woff'); font-display: swap; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 700; src: local('Open Sans Semibold'), local('OpenSans-semibold'), url(/_assets/_fonts/opensans/opensans-semibold.woff2) format('woff2'), url(/_assets/_fonts/opensans/opensans-semibold.woff) format('woff'); font-display: swap; }
@font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 300; src: local('Open Sans Light'), local('OpenSans-Light'), url(/_assets/_fonts/opensans/opensans-light.woff2) format('woff2'), url(/_assets/_fonts/opensans/opensans-light.woff) format('woff'); font-display: swap; }


/*********

Marine Studies CSS

*********/

body {
    background: url(gfx/background-inside.png) center 0px repeat-x;
}
header#global_intro h1 {
	font-family: 'Amsi Pro Condbold', 'Open Sans', Helvetica, arial, sans-serif;
	font-size: 23px;
  letter-spacing: 0.01em;
  line-height: 1.1;
}
header#global_intro h1.global_intro_maori {
  font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.25;
  margin-top: 5px;
  padding-bottom: 14px;
}
#wrapper {
    background: url(gfx/banner-inside.jpg) right 0px no-repeat;
}
#title h1 {
  background: url(gfx/title-2019.png) 0px 35px no-repeat;
  color: #1F4A8C;
  font-family: 'Amsi Pro Condbold', 'Open Sans', Helvetica, arial, sans-serif;
  font-size: 45px;
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 0 23px;
  max-width: 650px;
  opacity: 1;
  padding: 270px 0 21px 0px;
  position: relative;
  text-rendering: optimizeLegibility;
}
#title img {
	display: none;
}
#content h2 {
    border-bottom: none;
    color: #163568;
    font-family: 'Amsi Pro Condlight', 'Open Sans', Helvetica, arial, sans-serif;
    font-size: 35px;
    font-weight: 300;
    margin: 0 0 14px 0;
    text-rendering: optimizeLegibility;
}
#content p + h2,
#content table + h2,
#content ul + h2,
#content ol + h2,
#content dl + h2,
#content form + h2,
#content div + h2 { margin-top: 35px; }
#content p,
#content ul,
#content ol,
#content table,
#content dl,
#content dt,
#content dd,
#content form,
#content fieldset,
#content legend,
#content label,
#content select,
#content option,
#content textarea,
#content input,
#right p,
#right li,
#right dt,
#right dd {
  font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
  font-weight: 400;
}
#content table td,
#content table td p {
  line-height: 1.5;
}
#content th,
#content td,
#right p,
#right li {
  font-size: 13px;
  line-height: 1.6;
}
#content ul {
    margin-left: 16px;
}
#content ul li {
    margin-bottom: 3px;
}
#content table th {
    background-color: #f1f4f8;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 700;
    line-height: 1.5;
    padding: 7px;
}
.pagesubnav {
    overflow: hidden;
}
#content .pagesubnav .grid_half {
    width: 45%;
    margin-right: 5%;
}
#right {
	background-image: none;
}
#right h2 {
    margin-bottom: 14px;
}
#right h3 {
    line-height: 1.5;
    margin-bottom: 7px;
}
#right ul li {
    margin-left: 12px;
}
#content .grid3 .grid1 {
    margin-bottom: 35px;
}
#content .grid3 .grid1 p {
    margin-bottom: 0;
    line-height: 1.4;
}
#content .grid3 .grid1 a,
#content .grid3 .grid1 a img {
    border-bottom: none;
    transition: all 0.2s ease;
}
#content .grid3 .grid1 a img:hover {
    box-shadow: 0 0 10px #e4e4e4;
}
#content .grid3 .grid1 img {
    margin-left: 0;
    margin-bottom: 7px;
    border: none;
    padding: 0;
    max-width: 100%;
}
#content .grid3 .grid1:nth-of-type(3n) {
    margin-right: 0;
}
ul#social_media {
	height: auto;
	padding-bottom: 50px;
}
#map_canvas {
   width: 100%;
   height: 400px;
}
#content p#map_canvas img {
    max-width: none;
}


/* //////////// Frontpage styles /////////////// */

body.frontpage {
	background: url(gfx/background.png) center 0px repeat-x;
}
body.frontpage #wrapper {
	background: url(gfx/banner.jpg) right 0px no-repeat;
}
body.frontpage #title h1.notopimage {
    background-position: 0 75px;
    font-size: 50px;
    max-width: 100%;
    margin-bottom: 0;
    padding-right: 0;
    padding-top: 345px;
}
body.frontpage #content hr {
	margin: 0px 0 14px 0;
    padding: 0;
	border-top: 1px solid #e4e4e4;
}
body.frontpage #content {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 105px;
}
body.frontpage #content h2 {
    color: #555555;
    font-family: 'Amsi Pro Condlight', 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-size: 28px;
    font-weight: 300;
    line-height: 1.2;
	padding-top: 0px;
	padding-bottom: 35px;
	border-top: none;
	border-bottom: none;
	margin-bottom: 0;
    margin: 0px;
}
body.frontpage #content h2 em {
    color: #000000;
    font-style: italic;
    font-weight: 300;
}
body.frontpage #content h3 {
    color: #1F4A8C;
    font-family: 'Amsi Pro Condbold', 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-size: 28px;
	font-weight: 700;
    line-height: 1.1;
    padding: 14px 0 0px 14px;
}
body.frontpage #content p + h3:after {
    background: #f9c000;
    content: '';
    display: block;
    height: 4px;
    margin-bottom: 14px;
    margin-top: 21px;
    width: 37px;
}
body.frontpage #content.otgx {
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;
    width: 100%;
}
body.frontpage #content.otgx .grid_third {
    background: #fbfbfb;
    border: 1px solid #dddddd;
    border-radius: 3px;
    box-sizing: border-box;
    box-shadow: 0px 5px 5px #eeeeee, 0px 20px 30px #f5f5f5;
    margin-bottom: 21px;
    margin-right: 5.2%;
    padding-bottom: 14px;
    width: 29.6%;
}
body.frontpage #content .grid_third:nth-of-type(4) {
    margin-right: 0;
}
body.frontpage #content .grid_third img {
    width: 100%;
    border-radius: 2px 2px 0px 0px;
    border: 0;
    margin-left: 0;
    margin-bottom: 0;
    padding: 0;
    max-width: 100%;
}
body.frontpage #content .grid_third p {
    margin-left: 14px;
    margin-right: 14px;
}
body.frontpage #content .grid_third p:first-child {
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
}
body.frontpage #content .grid_third a {
    text-decoration: none;
    border-bottom: none;
}
body.frontpage #content .grid_third ul {
    margin-left: 28px;
    margin-right: 14px;
}
body.frontpage #content .grid_third ul li {
    list-style-image: url(/_assets/_gfx/arrow-grey-forward.svg);
    margin-bottom: 14px;
}
body.frontpage #content p.clearall {
    line-height: 0;
    margin-bottom: 0;
}
body.frontpage #right {
	background-image: none;
	clear: both;
	margin: -250px 0 0 0;
	padding: 0;
}
body.frontpage article {
    margin-left: 14px;
    margin-right: 14px;
}
body.frontpage .events article {
    background: none;
    margin-bottom: 28px;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 0;
}
body.frontpage .events article p {
    margin-bottom: 14px;
}
body.frontpage article img {
	display: none;
}
body.frontpage #content article h3 {
    color: #163568;
	font-size: 14px;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 0;
    padding: 0;
    text-align: left;
}
body.frontpage #content .events article h3 {
    margin-bottom: 7px;
}
body.frontpage #content p.smalltag {
    margin-left: 0;
    font-style: normal;
}
.news article:hover {
    background-color: none;
}
.events {
    clear: both;
}
body.frontpage #content .events h3 {
    margin-bottom: 21px;
    padding-left: 0;
}

/**********
Portobello tide monitor chart css
**********/
body.OTAGO692220 canvas#chart  { width: 100% !important; height: 500px !important; }



/*****************

MEDIA QUERIES

*****************/


@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (min-resolution: 2dppx), (min-resolution: 192dpi) {
  #title h1 {
     background-image: url(gfx/title-2019@2x.png);
     background-size: 255px;
  }
  body.frontpage #title h1.notopimage {
    background-image:  url(gfx/title-2019@2x.png);
    background-size: 255px;
  }
}


/*****

iPad landscape >

*****/

@media only screen and (min-width: 769px) and (max-width: 1024px) {
	#wrapper {
        background: url(gfx/banner-inside.jpg) -300px 0px no-repeat;
    }
    body.frontpage #wrapper {
	    background: url(gfx/banner.jpg) -100px 0px no-repeat;
    }
    #title h1.notopimage {
        max-width: 100%;
        padding-right: 0;
    }
    body.frontpage #features {
        width: 186px;
    }
    body.frontpage #content.otgx .grid_third {
        margin-right: 5.1%;
    }
    body.frontpage #content .grid_third:nth-of-type(4) {
        margin-right: 0;
    }
}


/*****

Portrait tablet ^

*****/

@media only screen and (max-width: 768px) {
    #wrapper,
    body.frontpage #wrapper {
        background-position: -330px 0;
    }
    #title h1.notopimage {
        max-width: 100%;
        padding-right: 0;
        line-height: 1.2;
    }
    body.frontpage #content.otgx .grid_third {
        margin-bottom: 35px;
        margin-right: 0;
        width: 100%;
    }
    body.frontpage #content {
        width: auto;
    }
	#right {
		border-top: 1px solid #e4e4e4;
		margin-top: 0px;
	}
	body.frontpage #right {
		border-top: none;
		width: 186px;
        position: absolute;
        top: 600px;
        left: 60px;
	}
    #right .rightwidget {
        padding-right: 0;
    }
    body.frontpage #right {
        margin-top: 0;
    }
    #content .grid3 .grid1:nth-of-type(3n) {
       margin-right: 46px;
    }
    #content .grid3 .grid1:nth-of-type(2n) {
       margin-right: 0px;
    }
}

/*****

Mobile styles (phone and small tablet) media query

*****/

@media only screen and (max-width: 700px) {
    body,
    body.frontpage {
        background: none;
    }
    #wrapper,
    body.frontpage #wrapper {
        background: url(gfx/banner.jpg) -230px 0px repeat-x;
        background-size: 900px;
    }
    .titleinner,
    body.frontpage .titleinner {
        width: 92%;
    }
    #title h1.notopimage {
        background-size: 160px;
        background-position: 0 30px;
        margin-left: 0;
        padding-top: 190px;
        width: 97%;
    }
    body.frontpage #title h1.notopimage {
        background-position: 0 30px;
        background-size: 160px;
        font-size: 38px;
        padding-top: 190px;
    }
    .titleinner h1 {
        max-width: 100% !important;
        min-width: 186px !important;
    }
    #content p.fullwidthimage {
        padding-bottom: 0;
    }
    #content p.fullwidthimage img {
        float: none;
    }
    body.frontpage #content.otgx {
        width: 97%;
    }
    body.frontpage #content.otgx .grid_third {
        margin-right: 5.1%;
        width: 29.6%;
    }
    body.frontpage #content.otgx .grid_third h3 {
        line-height: 1.2;
        margin-top: 14px;
        padding-top: 0;
    }
    body.frontpage #content.otgx .grid_third:nth-of-type(4) {
        margin-right: 0;
    }
    body.frontpage #content .grid_third img {
        float: none;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
    }
    body.frontpage #content.otgx .grid_third article h3 {
        line-height: 1.5;
        margin-left: 0;
    }
    body.frontpage #right {
        width: 98%;
        position: static;
        top: auto;
        left: auto;
        margin-top: 0;
    }
    #content .grid3 .grid1 {
        width: 47.5%;
        float: left;
        margin-right: 5%;
    }
    #content .grid3 .grid1:nth-of-type(2n) {
        margin-right: 0;
    }
    #content .grid3 .grid1:nth-of-type(2n+1) {
        margin-right: 5%;
    }
    #content .grid3 .grid1 img {
        float: none;
        max-width: 100%;
    }
}


@media only screen and (max-width: 480px) {
    body.frontpage #content.otgx .grid_third {
        margin-right: 0%;
        width: 100%;
    }
}