/*! 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: url(/_assets/_fonts/amsipro/amsiprocond-bold-webfont.woff2) format('woff2'), url(/_assets/_fonts/amsipro/amsiprocond-bold-webfont.woff) format('woff'); font-weight: 700; font-style: normal; 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-face { font-family: 'Open Sans'; font-style: italic; font-weight: 400; src: local('Open Sans Italic'), local('OpenSans-italic'), url(/_assets/_fonts/opensans/opensans-italic.woff2) format('woff2'), url(/_assets/_fonts/opensans/opensans-italic.woff) format('woff'); }
@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-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'); }

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

Careers Development Centre Summit CSS

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

body {
    background: url(gfx/background-frontpage.png) 0px 0px repeat-x;
    text-rendering: optimizeLegibility;
}
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-frontpage.jpg) center 0px no-repeat;
}
#title h1 {
    background: url(gfx/title-2021.png) 2px 90px no-repeat;
    color: #1f4a8c;
    font-family: 'Amsi pro condbold', Helvetica, Arial, Geneva, sans-serif;
    font-size: 50px;
    font-variant-ligatures: normal;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.05;
    margin-top: 3px;
    max-width: 650px;
    padding: 400px 43px 21px 23px;
    position: static;
	opacity: 1;
    -moz-osx-font-smoothing: grayscale;
}
#title h1.notopimage {
    max-width: 650px;
}
.titleinner img {
    display: none;
}
.titleinner h1 {
    margin-top: 0px;
}
#title ul#breadcrumbs {
    margin-bottom: 28px;
}
#content {
    box-sizing: border-box;
    padding-top: 0;
    max-width: 100%;
    width: 100%;
}
#content h2 {
    border-bottom: none;
    font-family: 'Amsi Pro Condlight', 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-size: 34px;
    font-weight: 300;
    line-height: 1.1;
    margin-bottom: 21px;
    margin-top: 0;
}
#content div + h2,
#content p + h2,
#content table + h2,
#content ul + h2,
#content ol + h2,
#content dl + h2,
#content button + h2,
#content form + h2,
#content blockquote + h2 {
    margin-top: 35px;
}
#content h3 {
    color: #1f4a8c;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 14px;
    margin-top: 28px;
}
#content p,
#content ul,
#content ul li,
#content ol,
#content ol li,
#content table,
#content dl,
#content dt,
#content dd,
#content form,
#content fieldset,
#content legend,
#content label,
#content select,
#content option,
#content textarea,
#content input,
#content blockquote,
#content ul.pagesubnav li a,
#right p,
#right li,
#right dt,
#right dd,
.ch-startdate,
.ch-enddate,
.ch-summary {
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 400;
    line-height: 1.6;
}
#content p,
#content ul,
#content ul li,
#content ol,
#content ol li,
#content dl,
#content dt,
#content dd,
#content form,
#content fieldset,
#content legend,
#content label,
#content select,
#content option,
#content textarea,
#content input,
#content button,
#content ul.pagesubnav li a {
    font-size: 15px;
}
#content .content-button a, #content .next-step a, #right .next-step a {
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 400;
}
#content ul,
#content ol {
    margin-left: 14px;
}
#content ul li,
#content ol li {
    margin-bottom: 3px;
}
#content ul.pagesubnav {
    border: 1px solid #dddddd;
    padding: 14px;
}
#content ul.pagesubnav li a {
    display: inline-block;
    padding-bottom: 7px;
}
#content a[href*=".pdf"] {
    background: url(/_assets/_gfx/sprite-icons.gif) no-repeat -476px -125px;
}
#content a[href*="linkedin.com"] {
    background: url(/_assets/_gfx/sprite-socialmedia-icons.png) no-repeat -196px -155px;
}
#content img {
    max-width: 100%;
}
#content p.content-button {
    margin-bottom: 28px;
    margin-top: 28px;
}
#content blockquote p:last-of-type {
    margin-bottom: 0;
}
body.OTAGO203211 #content,
body.OTAGO206801 #content,
body.OTAGO203210 #content,
body.OTAGO203208 #content,
body.OTAGO214401 #content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#content .shadow-box.insidepage {
    border: 1px solid #dddddd;
    border-radius: 3px;
    box-shadow: 0 3px 5px rgba(0,0,0,0.1), 0 10px 20px rgba(0,0,0,0.2);
    box-sizing: border-box;
    margin-bottom: 35px;
    margin-right: 6.5%;
    margin-top: 14px;
    padding-bottom: 10px;   
    transition: all 0.3s ease-out;
    width: 29%;
}
#content .shadow-box.insidepage:hover {
    box-shadow: 0 0 3px #e4e4e4;
}
#content .shadow-box.insidepage.grid1 {
    width: 22%;
    min-height: 196px;
    margin-right: 4%;
}
#content .shadow-box.insidepage.half-grid {
    margin-right: 5%;
    width: 47.5%;
}
#content .shadow-box.insidepage.half-grid:nth-of-type(2n) {
    margin-right: 0;
}
#content .shadow-box.insidepage h2,
#content .shadow-box.insidepage p:not(:first-of-type) {
    margin-left: 14px;
    margin-right: 14px;
}
#content .shadow-box.insidepage h2 {
    font-family: 'Amsi pro condbold', 'Open Sans', Helvetica, Arial, Geneva, sans-serif; 
    font-size: 25px;
    margin-bottom: 14px;
}
#content .shadow-box.insidepage h2 a {
    display: block;
    padding-top: 7px;
}
#content .shadow-box.insidepage.grid1 h2 {
    font-size: 16px;
}
#content .shadow-box.insidepage p {
    margin-bottom: 7px;
    line-height: 1.5;
}
#content .shadow-box.insidepage p + h2:first-of-type {
    margin-top: 0px;
}
#content .shadow-box.insidepage h2:after {
    display: block;
    width: 42px;
    height: 4px;
    content: '';
    margin-top: 14px;
    background: #f9c000;
}
#content .shadow-box.insidepage:nth-of-type(3n) {
    margin-right: 0;
}
body.OTAGO203208 #content .shadow-box.insidepage:nth-of-type(6) {
    margin-right: 0;
}
#content .shadow-box.insidepage.grid1:nth-of-type(3) {
    margin-right: 4%;
}
#content .shadow-box.insidepage.grid1:nth-of-type(4) {
    margin-right: 0;
}
#content hr {
    border-top: 5px dotted #dddddd;
    margin-top: 35px;
}
#content ul.pagesubnav {
    padding-bottom: 21px;
}
#content ul.pagesubnav h3 {
    font-size: 18px;
    margin-top: 7px;
}
#content .content-navigation h2 {
    border-top: 1px solid #e4e4e4;
    padding-top: 14px;
}
/* For employers page */
body.OTAGO214401 #content h2 {
    font-size: 21px;
    margin-top: 0;
    margin-bottom: 0px;
}
body.OTAGO214401 #content p a {
    border-bottom: none;
}
#map_canvas {
    width: 100%;
    height: 450px;
}
/* Careers Resource Library search */
form#resourcesearch fieldset {
    margin-left: 0;
    margin-right: 0;
    padding: 4% 10% 1% 0;
    box-sizing: border-box;
    width: 100%;
    border-radius: 3px;
    border: 1px solid #dddddd;
}
form#resourcesearch fieldset legend {
    margin-left: 2%;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 300;
}
form#resourcesearch fieldset label {
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 400;
    margin-bottom: 3px;
    padding-left: 10%;
}
#content form#resourcesearch fieldset input,
#content form#resourcesearch fieldset select {
    width: 90%;
    margin-left: 10%;
    box-sizing: border-box;
}
#content form#resourcesearch fieldset button.search {
    background-color: #416ebf;
    text-align: center;
    padding: 4px 35px;
    width: auto;
    float: right;
    margin-right: 0;
    margin-top: 7px;
    border: 2px solid #316394;
    color: #ffffff;
    background-position: -55px 5px;
}

/* Careers options */

body.OTAGO205225 #content,
body.OTAGO205225 #content #box1 {
    display: flex;
    flex-wrap: wrap;   
}
#right {
    background: none;
}

/*  FRONTPAGE  */

body.frontpage #title h1 {
    font-size: 65px;
    line-height: 1;
    max-width: 100%;
    padding: 400px 0px 42px 23px;
}
body.frontpage #content.otgx {
    display: flex;
    flex-wrap: wrap;
}
body.frontpage #content h2 {
    font-size: 35px;
    font-weight: 300;
    margin-bottom: 28px;
    width: 100%;
}
body.frontpage #content .grid-third {
    box-sizing: border-box;
    border: 1px solid #dddddd;
    border-radius: 3px;
    box-shadow: 0 5px 10px #e4e4e4, 0 20px 30px #f5f5f5;
    margin-bottom: 46px;
    margin-right: 6.5%;
    transition: all 0.3s ease;
    width: 29%;
}
body.frontpage #content .grid-third:hover {
    box-shadow: 0 1px 2px #e4e4e4, 0 5px 10px #f5f5f5;
}
body.frontpage #content .grid-third:nth-of-type(4) {
    margin-right: 0;
}
body.frontpage #content .grid-third h3 {
    font-family: 'Amsi Pro Condbold', 'Open sans', Helvetica, Arial, sans-serif;
    font-size: 29px;
    font-weight: 700;
    margin-bottom: 14px;
    margin-top: 0;
    padding-left: 14px;
    padding-right: 14px;
    position: relative;
    line-height: 1
}
body.frontpage #content .grid-third h3 a {
    display: block;
}
body.frontpage #content .grid-third img {
    border: none;
    border-bottom: 10px solid #f9c000;
    border-radius: 3px 3px 0 0;
    margin: 0;
    padding: 0;
    width: 100%;
}
body.frontpage #content .grid-third p:nth-of-type(2) {
    font-size: 15px;
    margin-left: 14px;
    margin-right: 14px;
}
body.frontpage #content .employer-box {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
body.frontpage #content .employer-box .grid-third:nth-of-type(3) {
    margin-right: 0;
}
body.frontpage #content .employer-box p a {
    display: block;
    font-family: 'Amsi Pro Condbold', 'Open sans', Helvetica, Arial, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}
body.frontpage #content .employer-box p a span {
    display: block;
    padding: 14px;
}
#content .student-region {
    width: 100%;
}
#content .student-region span {
    color: #f9c000;
}
#content .employer-region span {
    color: #a4c5ff;
}
#content .shadow-box.student-region,
#content .shadow-box.employer-region {
    box-shadow: 0 5px 10px #e4e4e4, 0 20px 30px #f5f5f5;
    border: 1px solid #dddddd;
    padding: 0%;
    box-sizing: border-box;
    margin-top: 0px;
    margin-bottom: 77px;
    border-radius: 3px;
}
#content .shadow-box.student-region h3,
#content .shadow-box.employer-region h3 {
    font-family: 'Amsi Pro Condbold', 'Open sans', Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 35px;
    margin: 14px 28px 7px 28px;
}
#content .shadow-box h3:after {
    background: #f9c000;
    content: '';
    display: block;
    height: 5px;
    margin-bottom: 14px;
    margin-top: 14px;
    width: 47px;
}
#content .shadow-box a,
body.frontpage #content.otgx a {
    border-bottom: none;
}
body.frontpage #content .shadow-box p {
    margin-left: 28px;
    margin-right: 28px;
}
body.frontpage #content .shadow-box p:nth-of-type(1) {
    margin-left: 0;
    margin-right: 0;
}
body.frontpage #content .shadow-box p:last-of-type {
    margin-bottom: 28px;
}
#content .shadow-box img {
    border: none;
    border-radius: 3px 3px 0 0;
    margin: 0;
    padding: 0;
    width: 100%;
}
body.frontpage #content .shadow-box img {
    border-bottom: 14px solid #f9c000;
}
#content .shadow-box ul {
    margin-bottom: 21px;
    margin-left: 44px;
}
#content .shadow-box ul li {
    list-style-image: url(/_assets/_gfx/arrow-grey-forward.svg);
    margin-bottom: 7px;
}
body.frontpage .promo-box {
    border: 1px solid #dddddd;
    border-radius: 3px;
    box-sizing: border-box;
    margin-bottom: 77px;
    padding-left: 28px;
    width: 100%;
}
body.frontpage .promo-box:nth-of-type(2n+1) {
    margin-right: 0;
}
body.frontpage #content .promo-box p:nth-of-type(1) {
    height: 100%;
    float: right;
}
body.frontpage #content .promo-box p img {
    border: none;
    height: 100%;
    line-height: 1;
    margin: 0;
    max-width: 186px;
    object-fit: cover;
    padding: 0;
}
body.frontpage #content .promo-box p {
    margin-bottom: 0;
}
body.frontpage #content .promo-box p:nth-of-type(3) {
    font-size: 15px;
    line-height: 1.5;
    margin-bottom: 7px;
}
body.frontpage #content .promo-box p:nth-of-type(4) {
    margin-bottom: 21px;
}
body.frontpage #content .promo-box h2 {
    color: #1f4a8c;
    font-family: 'Amsi Pro condbold', 'Open sans', Helvetica, Arial, sans-serif;
    font-size: 30px;
    line-height: 1.2;
    margin-bottom: 14px;
    margin-top: 21px;
}
body.frontpage #content .promo-box a {
    background: #00508F;
    border-radius: 16px;
    color: #ffffff;
    display: inline-block;
    font-size: 15px !important;
    font-weight: bold;
    margin-bottom: 7px;
    margin-top: 7px;
    padding: 6px 14px;
}
body.frontpage #content .shadow-box .login-button a {
    background: #00508F;
    border: 2px solid #dddddd;
    border-radius: 20px;
    color: #ffffff;
    display: inline-block;
    font-family: 'Amsi Pro condbold', 'Open sans', Helvetica, Arial, sans-serif;
    font-size: 20px;
    letter-spacing: 0.01em;
    line-height: 1.2;
    font-weight: 700;
    padding: 5px 20px 8px 20px;
}
body.frontpage #content .shadow-box .login-button a strong {
    color: #f9c000;
}
body.frontpage .news-region,
body.frontpage .events-region,
body.frontpage .profiles-region,
body.frontpage .resources-region {
    width: 21%;
    margin-right: 5.3%;
}
body.frontpage .resources-region {
    margin-right: 0;
}
body.frontpage #content .news-region h2,
body.frontpage #content .events-region h2,
body.frontpage #content .profiles-region h2 {
    font-family: 'Amsi Pro Condlight', 'Open sans', Helvetica, Arial, sans-serif;
    font-size: 25px;
    line-height: 1.3;
    margin-bottom: 14px;
}
body.frontpage #content .news-region article h3,
body.frontpage #content .events-region article h3,
body.frontpage #content .profiles-region article h3 {
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 400;
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 4px;
}
body.frontpage #content p.smalltag,
body.frontpage #content .profiles-region article p {
    color: #999999;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-size: 13px;
    line-height: 1.5;
}
body.frontpage #content .news-region p.smalltag,
body.frontpage #content .events-region p.smalltag {
    padding-left: 18px;
    background: url(/_assets/_gfx/calendar-icon-grey.svg) left 2px no-repeat;
}
body.frontpage #content .resources-region ul {
    margin-left: 14px;
}
body.frontpage #content .news-region li,
body.frontpage #content .events-region li,
body.frontpage #content .resources-region li {
    font-size: 13px;
    margin-bottom: 7px;
}
body.frontpage .youtube-region {
    margin-bottom: 77px;
    box-shadow: 0 0 10px #e4e4e4;
    line-height: 0;
    width: 100%;
}
body.frontpage #content #box8 {
    width: 100%;
    margin-bottom: 21px;
}
body.frontpage #content #box8 hr {
    border-top: 1px solid #dddddd;
}
body.frontpage #content .resources-region h3 {
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #888888;
}
body.frontpage #content .resources-region h3 strong {
    color: #222222;
}
body.frontpage #content .resources-region ul:nth-child(4) li:nth-child(1) {
    list-style-type: none;
    margin-left: -10px;
    padding-left: 0;
    padding-top: 3px;
    padding-bottom: 3px;
}
#content .facebook-button {
    background-color: #395797;
    border-radius: 16px;
}
#content .facebook-button a[href*="facebook.com"] {
    background-position:  -285px -60px;
    padding-left: 0;
}
#content .facebook-button a {
    color: #ffffff;
    text-align: center;
    display: block;
}
#content .facebook-button:hover {
    box-shadow: 0 0 10px #aaaaaa;
}
#content .facebook-button:active {
    box-shadow: 0 0 1px #cccccc;
}
body.frontpage #right {
    padding-left: 0;
    margin-top: -420px;
}

#right {
  background: none;
  box-sizing: border-box;
  margin-left: 0;
  padding-left: 232px;
  width: 100%;
}
#right .rightcontentwysiwyg {
  background-color: #F2F2F2;
  padding: 20px 20px 20px 30px;
  border-radius: 5px;
}
#right h2 {
  color: #333333;
  font-family: 'Amsi pro condlight', Helvetica, Arial, Geneva, sans-serif;
  font-size: 35px;
  letter-spacing: 0.01em;
  line-height: 1.05;
  padding-bottom: 10px;
  margin-bottom: 21px;
  text-transform: none;
}
#right p,
#right li {
    font-size: 15px;
}
#right p a,
#right li a {
    border-bottom: 1px solid #c9dcff;
}

/* Prefooter */

#prefooter {
    max-width: 1114px;
    width: 100%;
    margin: 0px auto 20px auto;
    box-sizing: border-box;
    padding-left: 232px;
    display: flex;
    flex-wrap: wrap;
    padding-top: 0px;
    padding-bottom: 21px;
}
body.frontpage #prefooter {
    max-width: 1114px;
    width: 100%;
    margin: 0px auto 20px auto;
    box-sizing: border-box;
    padding-left: 232px;
    display: flex;
    flex-wrap: wrap;
    padding-top: 0px;
    padding-bottom: 21px;
}
#prefooter p {
    margin-right: 1.5%;
    width: 11%;
    font-family: 'Open Sans', Helvetica, Arial, Geneva, sans-serif;
    font-weight: 300;
    font-size: 11px;
    position: relative;
    text-align: center;
    margin-top: 21px;
    padding: 30px 0;
    text-indent: -9999px;
}
body.frontpage #prefooter p {
    display: none;
    width: 15.4%;
}
#prefooter p:nth-of-type(1) { background: url(gfx/logos/otago-career-hub-logo.png) no-repeat center center; background-size: 50%; }
#prefooter p:nth-of-type(2) { background: url(gfx/logos/interview-stream-logo.png) no-repeat center center; background-size: 100%; }
#prefooter p:nth-of-type(3) { background: url(gfx/logos/goinglobal-logo.png) no-repeat center center; background-size: 100%; }
#prefooter p:nth-of-type(4) { background: url(gfx/logos/otagoextra-logo.png) no-repeat center center; background-size: 70%; }
#prefooter p:nth-of-type(5) { background: url(gfx/logos/unicrew-logo.png) no-repeat center center; background-size: 45%; }
#prefooter p:last-of-type {
    margin-right: 0;
}
#prefooter p a {
    border-bottom: none;
    text-decoration: none;
    color: #416ebf;
    display: block;
    height: 100%;
    padding: 14px 0;
}

.OTAGO718727 #content blockquote,
.OTAGO718734 #content blockquote {
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 3px;
    box-shadow: 0 4px 10px #f5f5f5;
    box-sizing: border-box;
    margin-bottom: 21px;
    padding-left: 56px;
    position: relative;
}
.OTAGO718727 #content blockquote::after,
.OTAGO718734 #content blockquote::after {
    background: url(/_assets/aquinas/gfx/quote-tail.svg) no-repeat center top;
    content: '';
    display: block;
    height: 20px;
    position: absolute;
    width: 20px;
    bottom: -14px;
    left: 14px;
}
.OTAGO718727 #content blockquote::before,
.OTAGO718734 #content blockquote::before {
    content: '“';
    color: #eeeeee;
    display: block;
    font-size: 80px;
    height: 20px;
    position: absolute;
    left: 14px;
    top: -15px;
    width: 20px;
}
.OTAGO718727 #content blockquote {
    margin-top: 28px;
    padding-bottom: 21px;
    padding-top: 14px;
}
.OTAGO718727 #content blockquote p:last-of-type {
    margin-bottom: 0;
}
.OTAGO718727 #content blockquote img {
    border: none;
    border-radius: 50%;
    float: right;
    margin-left: 0;
    margin-left: 21px;
    margin-right: 7px;
    margin-top: 7px;
    max-width: 80px;
    padding: 0;
}
.OTAGO718727 #content .quote-author {
    color: #777777;
    font-size: 12px;
    font-style: italic;
    margin-bottom: 35px;
}
.OTAGO718727 #content .quote-author strong {
    color: #1f4a8c;
    font-family: 'Amsi Pro Condbold';
    font-size: 20px;
    font-style: normal;
    letter-spacing: 0.01em;
}
.OTAGO718727 #content .featurebox_blue {
    background-color: #f9f9f9;
    border: 1px solid #dddddd;
    border-top: 4px solid #f9c000;
    border-radius: 3px;
    max-width: 650px;
    padding: 21px 28px;
}

/* @2x */

@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@2x-2021.png);
                background-size: 454px;
            }
            body.frontpage #title h1 {
                background-image: url(gfx/title@2x-2021.png);
                background-size: 454px;
            }
}

/* Tablet styles */

@media only screen and (min-width: 1024px) and (max-width: 1170px) {
    #wrapper {
        background: url(gfx/banner-frontpage.jpg) -450px 0px no-repeat;
    }
    #content .content-inner {
        max-width: 90%;
        margin: 100px 5% 50px 5%;
    }
    #contentwrapper,
    .titleinner,
    div#nav_holder,
    .topnavinner,
    footer.wrapper,
    div.footer_wrapper {
        width: 100%;
        box-sizing: border-box;
    }
    div#nav_holder {
        width: 98%;
    }
	.titleinner {
		padding-right: 2%;
        padding-left: 232px;
	}
	div#nav_holder {
		margin: 0 2%;
	}
    body.frontpage #content .shadow-box.employer-region,
    body.frontpage #content .shadow-box.student-region {
        margin-bottom: 35px;
    }
    body.frontpage #content .promo-box {
        padding-bottom: 21px;
    }
    body.frontpage #content .promo-box img {
        width: 100%;
        float: none;
        margin-right: 0;
    }
    body.frontpage #content .promo-box h2,
    body.frontpage #content .promo-box p {
        margin-left: 5%;
    }
    body.frontpage #content .promo-box p:nth-of-type(1) {
        margin-left: 0;
    }
    #right {
        width: 16.5%;
        padding-left: 4.5%;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    #wrapper,
    body.frontpage #wrapper {
        background-position: -500px 0;
    }
    #features {
        width: 650px;
    }
    #content .content-inner {
        max-width: 90%;
        margin: 100px 5% 50px 5%;
    }
    #contentwrapper,
    .titleinner,
    div#nav_holder,
    .topnavinner,
    footer.wrapper,
    div.footer_wrapper {
        width: 100%;
        box-sizing: border-box;
    }
    div#nav_holder {
        width: 98%;
    }
	.titleinner {
		padding-right: 2%;
        padding-left: 232px;
	}
	div#nav_holder {
		margin: 0 2%;
	}
    body.frontpage #content .shadow-box.employer-region,
    body.frontpage #content .shadow-box.student-region {
        margin-bottom: 35px;
    }
    body.frontpage #content .promo-box {
        padding-bottom: 21px;
    }
    body.frontpage #content .promo-box p img {
        width: 100%;
        float: none;
        margin: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
    body.frontpage #content .promo-box h2,
    body.frontpage #content .promo-box p {
        margin-left: 5%;
    }
    body.frontpage #content .promo-box p:nth-of-type(1) {
        margin-left: 0;
    }
    body.frontpage #right {
        width: 100%;
        margin-top: 0;
        padding-left: 0;
    }
    /* Career options */
    body.OTAGO205225 #content.otgx {
        width: 75%;
    }
    body.OTAGO205225 #content.otgx #box1 {
        display: flex;
        flex-wrap: wrap;
    }
    body.OTAGO205225 #content .insidepage.shadow-box {
        width: 20%;
    }
    body.OTAGO205225 #content .insidepage.shadow-box:nth-of-type(1n),
    body.OTAGO205225 #content .insidepage.shadow-box:nth-of-type(2n) {
        margin-right: 6.5%;
    }
    body.OTAGO205225 #content .insidepage.shadow-box:nth-of-type(4n) {
        margin-right: 0;
    }
}



@media only screen and (min-width: 769px) and (max-width: 910px) {
    #wrapper {
        background-position: -700px 0;
    }
    #content .shadow-box.insidepage {
        width: 100%;
        margin-right: 0;
    }
}

@media only screen and (min-width: 769px) and (max-width: 840px) {
    ul#breadcrumbs {
        font-size: 10px;
    }
}


@media only screen and (max-width: 768px) {
	#wrapper,
    body.frontpage #wrapper {
        background-position: -750px 0;
    }
    #title h1 {
        padding-right: 0;
        background-size: 370px;
        line-height: 1.3;
    }
    body.frontpage #title h1 {
        padding: 187px 0px 21px 4%;
        background-position: 4% 28px;
        background-size: 240px;
        font-size: 40px;
    }
    body.frontpage {
        background: none;
    }
    body.frontpage #wrapper {
        background-size: 850px;
        background-position: -60px 0px;
    }
    #content .shadow-box.student-region h3, #content .shadow-box.employer-region h3 {
        font-size: 18px;
        line-height: 1.3;
        margin-left: 21px;
    }
    body.frontpage #content .shadow-box p {
        margin-right: 14px;
        margin-left: 21px;
    }
    body.frontpage #content .promo-box {
        padding-bottom: 21px;
    }
    body.frontpage #content .promo-box img {
        width: 100%;
        float: none;
        margin-right: 0;
    }
    body.frontpage #content .promo-box h2,
    body.frontpage #content .promo-box p {
        margin-left: 5%;
    }
    body.frontpage #content .promo-box p:nth-of-type(1) {
        margin-left: 0;
    }
    body.frontpage #content .news-region,
    body.frontpage #content .events-region,
    body.frontpage #content .profiles-region,
    body.frontpage #content .resources-region {
        width: 47.3%;
    }
    body.frontpage #content .events-region {
        margin-right: 0;
    }
    /* Career options */
    body.OTAGO205225 #content.otgx {
        max-width: 418px;
    }
    body.OTAGO205225 #content.otgx .insidepage.shadow-box {
        width: 47.3%;
        margin-bottom: 14px;
    }
    body.OTAGO205225 #content.otgx .insidepage.shadow-box:nth-of-type(2n) {
        margin-right: 0;
    }
    #right {
        border-top: none;
    }
    #right .rightwidget {
        box-sizing: border-box;
        width: 100%;
    }
    #features .events {
        width: 418px;
        margin-left: 232px;
        border-left: none;
    }
    #features .events article {
        margin-top: 14px;
    }
    #features .events article:first-child {
        margin-top: 14px;
    }
    body.frontpage #right {
     margin-top: 0;
        border-top: none;
    }
    #prefooter,
    body.frontpage #prefooter {
        padding-left: 282px;
    }
}

/* Mobile styles*/

@media only screen and (max-width: 700px) {
    body,
    body.frontpage {
        background: none;
    }
    body.frontpage .titleinner,
    .titleinner {
        width: 100%;
    }
    #wrapper,
    body.frontpage #wrapper {
        background: url(gfx/banner.jpg) -400px 0px no-repeat;
        background-size: 1100px;
    }
    #title h1,
    body.frontpage #title h1 {
        background-position: 4% 28px;
        background-size: 240px;
        font-size: 45px;
        line-height: 1.05;
        padding: 177px 4% 28px 4%;
    }
    .titleinner h1 {
       max-width: 97% !important;
    }
    #title ul#breadcrumbs {
        margin-left: 4%;
    }
    #features .events {
        width: 97%;
        margin-left: 0px;
        padding: 0;
    }
    #content {
        max-width: 97%;
    }
    #content .shadow-box.insidepage img {
        max-width: 100%;
        margin-left: 0;
        margin-bottom: 7px;
    }
    body.frontpage #content.otgx {
        width: 97%;
    }
    body.frontpage #content img {
        float: none;
        max-width: 100%;
        margin-left: 0;
    }
    #content .shadow-box.student-region h3,
    #content .shadow-box.employer-region h3 {
        margin-right: 7px;
        font-size: 18px;
        margin-left: 14px;
    }
    body.frontpage #content .shadow-box p,
    body.frontpage #content .shadow-box p {
        margin-left: 14px;
        font-size: 13px;
    }
    #content .shadow-box h3:before {
        left: -10px;
        top: 7px;
    }
    body.frontpage #content .promo-box p img {
        max-width: 95%;
    }
    body.frontpage #content .news-region,
    body.frontpage #content .events-region,
    body.frontpage #content .profiles-region,
    body.frontpage #content .resources-region {
        width: 100%;
        margin-right: 0;
        margin-bottom: 21px;
    }
    body.frontpage #content .events-region h2,
    body.frontpage #content .profiles-region h2,
    body.frontpage #content .resources-region h3 {
        margin-bottom: 7px;
        border-top: 1px solid #e4e4e4;
        padding-top: 14px;
    }
    body.frontpage #content .news-region h2 {
        border-top: none;
        margin-top: 0;
        padding-top: 0;
        margin-bottom: 7px;
    }
    body.frontpage #content .profiles-region img {
        float: left;
        margin-right: 5%;
        max-width: 50%;
    }
    /* Career options */
    body.OTAGO205225 #content.otgx {
        max-width: 97%;
    }
    body.OTAGO205225 #content.otgx #box1 {
        display: flex;
        flex-wrap: wrap;
    }
    #content.otgx .insidepage.shadow-box img {
        float: none;
    }
    #features .events article:nth-of-type(2n) {
        margin-right: 0;
    }
    #map_canvas {
        height: 250px;
    }
    #content .facebook-button {
       max-width: 150px;
    }
    #prefooter,
    body.frontpage #prefooter {
        margin-left: 0%;
        padding-left: 0;
    }
    #prefooter p {
        width: 14.5%;
    }
    #right {
        padding-left: 0;
        width: 97%;
    }
}


@media only screen and (max-width: 550px) {
    body.frontpage #content h2 {
        line-height: 1.1;
    }
    body.frontpage #content .grid-third h3::before {
        font-size: 24px;
        height: 28px;
        left: 0;
        margin-bottom: 7px;
        position: relative;
        width: 28px;
    }
    body.frontpage #content .grid-third {
        margin-right: 4%;
        width: 30.6%;
    }
    body.frontpage #content .grid-third h3 {
        font-size: 28px;
        padding-left: 14px;
    }
    body.frontpage #content .grid-third p {
        margin-bottom: 7px;
    }
    body.frontpage #content .grid-third p:nth-of-type(2) {
        font-size: 18px;
        margin-bottom: 21px;
        margin-left: 14px;
        margin-right: 14px;
    }
    body.frontpage #content .employer-box p a {
        font-size: 19px;
    }
    body.frontpage #content .employer-box p a span {
        padding: 14px;
    }
    body.frontpage .youtube-region {
        margin-bottom: 42px;
    }
}

@media only screen and (max-width: 520px) {
    #wrapper,
    body.frontpage #wrapper {
        background: url(gfx/banner.jpg) -580px 0px no-repeat;
        background-size: 1100px;
    }
    #content .insidepage.shadow-box {
        margin-bottom: 21px;
        margin-right: 0;
        width: 100%;
    }
}

@media only screen and (max-width: 500px) {
    #prefooter,
    body.frontpage #prefooter {
        margin-left: 0%;
        padding-left: 0;
     }
    #prefooter p ,
    body.frontpage #prefooter p {
        width: 30%;
    }
}