/* ============================================================================= CUSTOM VARS 	 ========================================================================== */
/* ============================================================================= CUSTOM CLASSES || EXTENDS  	 ========================================================================== */
/* ============================================================================= CUSTOM MIXINS 	 ========================================================================== */
/* ============================================================================= CUSTOM FONTS 	 ========================================================================== */
.zoomable-sunburst { position: relative; overflow: visible; max-width: 650px; height: 500px; margin: 25px auto; }

div.sunburst--tooltipbox { position: absolute; min-height: 24px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; z-index: 999; }
div.sunburst--tooltipbox svg { margin-top: 8px; }

div.sunburst--tooltip { text-align: center; width: auto; height: auto; padding: 5px; font: 12px sans-serif; background: white; border: 0px; pointer-events: none; color: #555; max-width: 230px; -webkit-box-shadow: 0px 0px 25px -3px #111; box-shadow: 0px 0px 25px -3px #111; }
div.sunburst--tooltip p { margin: 7px 0px; }

.block.sunburst { border-top: 5px solid #6BB992; background: #f2f2f2; position: relative; padding: 1.5em; padding-top: 0; margin: 1em 0; }
.block.sunburst h3 { margin: 0.75em auto; color: #6BB992; }
.block.sunburst:after { width: 0; height: 0; border-right: 50px solid white; border-top: 50px solid transparent; position: absolute; content: ""; bottom: 0; right: 0; }

.crumbs.sunburst--breadcrumb { line-height: 1.7em; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-flow: row; flex-flow: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.crumbs.sunburst--breadcrumb li { display: -webkit-box; display: -ms-flexbox; display: flex; }
.crumbs.sunburst--breadcrumb a { display: inline-block; text-decoration: none; max-width: 300px; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; }
.crumbs.sunburst--breadcrumb a:hover { text-decoration: underline; }
.crumbs.sunburst--breadcrumb span { display: inline-block; text-decoration: none; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; margin: 0 2px; }

.sunburst--loader-container { min-height: 60px; margin-top: 10em; }

.sunburst--key-main { display: none; }

@media only screen and (max-width: 767px) { .sunburst--key-sidebar { display: none; }
  .sunburst--key-main { display: block; } }
.loader { color: #ccc; font-size: 20px; margin: 100px auto; width: 1em; height: 1em; border-radius: 50%; position: relative; text-indent: -9999em; -webkit-animation: load4 1.3s infinite linear; animation: load4 1.3s infinite linear; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); }

@-webkit-keyframes load4 { 0%,
  100% { -webkit-box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; }
  12.5% { -webkit-box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  25% { -webkit-box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  37.5% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  50% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  62.5% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; }
  75% { -webkit-box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; }
  87.5% { -webkit-box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; } }
@keyframes load4 { 0%,
  100% { -webkit-box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; }
  12.5% { -webkit-box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  25% { -webkit-box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  37.5% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  50% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  62.5% { -webkit-box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; }
  75% { -webkit-box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; }
  87.5% { -webkit-box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; } }
/* Important Information about this CSS File  - Do not delete or rename this file, if you do not use it leave it blank (delete everything) and the file will be skipped when you enable Production Mode in the Global theme settings.  - Read the _README file in this directory, it contains useful help and other information. */
/* Increase the body font size on small touch devices */
body { font-size: 100%; }

/* ============================================================================= MIXIN || VARS ========================================================================== */
/* ============================================================================= LAYOUT || STUCTURE || WIDTHS	 ========================================================================== */
.not-front #columns, #branding, #messages, .region-header, .region-leaderboard, #menu-bar > .region-inner, .block.hero, .not-front .region-secondary-content, .homepageslider .slidercontent, .region-sidebar-second, .boxed { width: 90%; margin-left: auto; margin-right: auto; }

.not-front .region-secondary-content { padding-bottom: 1em; }

.front .columns { padding-top: 0; }

.columns { padding-top: 0; }

.front div.homepagesection .view { margin: 0 5%; }

#block-system-main { padding-bottom: 1.5em; }

.form-item { max-width: 100%; }

/* ============================================================================= HEADERS || HTML ELEMENTS ========================================================================== */
h1 { font-size: 1.96875em; margin-top: 0.25em; }

h2 { font-size: 1.3em; font-weight: bold; }

h3 { font-size: 1.125em; }

blockquote { margin: 0.75em; padding: 0.75em; font-size: 1.1em; }

blockquote:after { right: 0; bottom: 0.5em; }

/* ============================================================================= VIEWS ========================================================================== */
.view.listing .views-row, .view.featured { border-bottom: none; padding: 0.5em 0; }

.slidercontent { margin-bottom: 1em; }

/* ============================================================================= LISTS ========================================================================== */
.content-column .node ul, .content-column .node ol { padding: 0 1em; }

/* ============================================================================= BLOCKS ========================================================================== */
.block.thelogo { margin-bottom: 0; padding-top: 0.5em; }

/* ============================================================================= HEADER LINKS WHICH ARE NOW IN THE FOOTER.. ========================================================================== */
#footer .region-header-links { padding: 5%; }
#footer .region-header-links .block-content { font-size: 0.9em; margin: 1em 0; }
#footer .region-header-links .social { display: block; height: initial; width: initial; text-indent: 0; border-radius: 0; background-color: initial; }
#footer .region-header-links .twitter:hover, #footer .region-header-links .facebook:hover, #footer .region-header-links youtube:hover { background-color: initial; }
#footer .region-header-links .facebook, #footer .region-header-links .twitter, #footer .region-header-links .youtube { background-image: none; }

/* ============================================================================= FOOTER ========================================================================== */
#footer { padding-top: 0; }
#footer .menu li { width: 45%; }

.region-footer { padding: 5%; }
.region-footer .block .block-title { font-size: 1.1em; }
.region-footer .block-content { font-size: 0.9em; }
.region-footer .block.first { padding-bottom: 1.5em; }

/* ============================================================================= MOBILE MENU || SEARCH ========================================================================== */
.mean-container .mean-bar { z-index: 10; }
.mean-container .mean-nav ul li a { text-transform: capitalize; }

.region-mobile-menu { z-index: 11; }
.region-mobile-menu p { margin-bottom: 0; }
.region-mobile-menu div.mobile-search-form { width: 70%; position: absolute; top: 12px; z-index: 13; background: black; height: 34px; }
.region-mobile-menu div.mobile-search-form .block-inner { text-align: right; margin-right: 10px; }
.region-mobile-menu div.mobile-search-form .form-text { border: 0; padding: 3px; }
.region-mobile-menu div.mobile-search-form #edit-submit--2 { border: 0; background: #03A8EA; color: white; border-radius: 5px; padding: 5px 10px; }
.region-mobile-menu div.mobile-search-reveal { transition: 0.4s all; width: 23px; height: 23px; overflow: hidden; position: absolute; top: 10px; right: 47px; z-index: 12; padding: 3px; }

/* ============================================================================= CAROUSEL || SLIDER || OVERLAY ========================================================================== */
.slider { font-size: 0.9em; }
.slider p { margin-bottom: 0; }
.slider .title { margin: 0.5em 0; }
.slider .title a { font-family: "Arimo", Arial, Helvetica, sans-serif; font-size: 1.5em; }
.slider .readmore { padding-top: 0.5em; }
.slider .flex-direction-nav a { top: 25%; }

/* ============================================================================= HOMEPAGE QUICK LINKS  ========================================================================== */
/* ============================================================================= HOMEPAGE TABS ========================================================================== */
.region-homepage-content .quick { margin: 0; }

.homepage-tab { padding: 4% 2% 4% 5%; font-size: 1.1em; font-weight: bold; display: block; background: #f2f2f2; position: relative; transition: 0.4s all; margin-bottom: 2px; }
.homepage-tab:first-letter { text-transform: capitalize; }
.homepage-tab .chevron { right: 5%; top: 40%; position: absolute; height: 10px; width: 20px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); transition: 0.4s all; }
.homepage-tab .chevron:before { content: ''; position: absolute; top: 0; left: 0; height: 50%; width: 50%; background: #707070; -webkit-transform: skew(0deg, 45deg); -moz-transform: skew(0deg, 45deg); -ms-transform: skew(0deg, 45deg); -o-transform: skew(0deg, 45deg); transform: skew(0deg, 45deg); }
.homepage-tab .chevron:after { content: ''; position: absolute; top: 0; right: 0; height: 50%; width: 50%; background: #707070; -webkit-transform: skew(0deg, -45deg); -moz-transform: skew(0deg, -45deg); -ms-transform: skew(0deg, -45deg); -o-transform: skew(0deg, -45deg); transform: skew(0deg, -45deg); }

.homepage-tab.selected { background: #03A8EA; color: white; }
.homepage-tab.selected .chevron { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
.homepage-tab.selected .chevron:after, .homepage-tab.selected .chevron:before { background: white; }

/* ============================================================================= SIMPLE GRID PAGE  ========================================================================== */
#isotopesection { clear: both; }
#isotopesection #isotopesection, #isotopesection .item, #isotopesection .item .text-wrapper { -webkit-transition-property: height, width, bottom; -moz-transition-property: height, width, bottom; -ms-transition-property: height, width, bottom; -o-transition-property: height, width, bottom; transition-property: height, width, bottom; -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
#isotopesection .item { box-shadow: inset 0px 0px 0px 10px white; }
#isotopesection .item { width: 185px; height: 185px; position: relative; float: left; }
#isotopesection .item .overlay { width: 185px; height: 185px; }
#isotopesection .item .colour { position: absolute; top: 105px; width: 165px; height: 70px; transition: all 0.5s ease; left: 10px; background: #03A8EA; }
#isotopesection .item img { position: relative; }
#isotopesection .item:after { width: 0; height: 0; border-right: 50px solid white; border-top: 50px solid transparent; position: absolute; content: ""; bottom: 0; right: 0; }
#isotopesection .item .text-wrapper { color: white; position: relative; top: 10px; left: 10px; line-height: 1.2; }
#isotopesection .item .text-wrapper a { text-decoration: none; color: white; }
#isotopesection .item .text-wrapper .title { font-size: 1.3em; font-family: "Raleway", Arial, Helvetica, sans-serif; margin-bottom: 0.25em; font-weight: bold; }
#isotopesection .item .text-wrapper .description { font-size: 1.1em; opacity: 0; }
#isotopesection .item.small .text-wrapper { width: 145px; }
#isotopesection .item.tall { height: 370px; }
#isotopesection .item.tall .overlay { height: 370px; }
#isotopesection .item.tall .text-wrapper { width: 145px; }
#isotopesection .item.tall .colour { top: 290px; }
#isotopesection .item.wide { width: 370px; }
#isotopesection .item.wide .overlay { width: 370px; }
#isotopesection .item.wide .text-wrapper { width: 330px; }
#isotopesection .item.wide .colour { width: 350px; }
#isotopesection .item.large { width: 370px; height: 370px; }
#isotopesection .item.large .overlay { width: 370px; height: 370px; }
#isotopesection .item.large .text-wrapper { width: 330px; }
#isotopesection .item.large .colour { width: 350px; top: 290px; }
#isotopesection .item.selected .description { opacity: 1; }
#isotopesection .item.selected .colour { height: 165px; top: 10px; }
#isotopesection .item.selected.tall .colour, #isotopesection .item.selected.large .colour { height: 350px; }
#isotopesection .item.selected .link { width: 185px; height: 185px; position: absolute; top: 0; background: transparent; z-index: 7; }
#isotopesection .item.selected.tall .link { height: 370px; }
#isotopesection .item.selected.wide .link { width: 370px; }
#isotopesection .item.selected.large .link { width: 370px; height: 370px; }
#isotopesection .isotope-hidden.item { pointer-events: none; z-index: 1; }

.casestudy.isotope #isotopesection .title, .casestudy.isotope #isotopesection .description { font-size: 0.9em; }

/* ============================================================================= FULLWIDTH PAGES   ========================================================================== */
body.breakout { width: 100%; }
body.breakout #breadcrumb, body.breakout #page-title { width: 90%; margin-left: auto; margin-right: auto; }

/* ============================================================================= CASE STUDY VIEW ========================================================================== */
.view.casestudy .view-header .streams a { font-size: 1.1em; }

.view.casestudy .form-type-bef-link:not(.form-item-edit-tid-all) a { font-size: 0.9em; }

/* ============================================================================= LEARNING NETWORK SECTION ========================================================================== */
.page-learning-networks-topics { /* -------------------------------------------	 setup elements ----------------------------------------- */ /* -------------------------------------------	 introduction block  ----------------------------------------- */ /* -------------------------------------------	 single items  ----------------------------------------- */ /* -------------------------------------------	 multiple items  ----------------------------------------- */ /* -------------------------------------------	 toggles ----------------------------------------- */ }
.page-learning-networks-topics .singles .view-header h2, .page-learning-networks-topics .singles .views-row, .page-learning-networks-topics .multiple { width: 90%; margin: 0 auto; }
.page-learning-networks-topics .view.intro .title { color: #03A8EA; font-size: 1.625em; font-family: "Raleway", Arial, Helvetica, sans-serif; font-weight: 300; }
.page-learning-networks-topics .singles .view-header h2 { font-size: 1.2em; margin-left: 5%; margin-top: 0; }
.page-learning-networks-topics .singles .view-header h2::after { height: 24px; width: 24px; background-size: 70%; background-repeat: no-repeat; background-position-x: 0%; background-position-y: 50%; }
.page-learning-networks-topics .singles .view-header.selected h2::after { background-position-x: 75%; }
.page-learning-networks-topics .multiple .casestudies .views-row, .page-learning-networks-topics .multiple .blogs .views-row { float: left; overflow: hidden; margin-bottom: 1em; }
.page-learning-networks-topics .multiple .casestudies .views-row .linkedtext, .page-learning-networks-topics .multiple .blogs .views-row .linkedtext { left: 16px; width: 288px; }
.page-learning-networks-topics .multiple .casestudies .views-row .colour, .page-learning-networks-topics .multiple .blogs .views-row .colour { width: 100%; }
.page-learning-networks-topics .learning-networks-items-toggle { margin: 1em auto; }
.page-learning-networks-topics .learning-networks-items-toggle div { width: 100%; margin: 0; }

/* ============================================================================= WYSIWYG OVERRIDES ========================================================================== */
#content .node-content .field-name-body img { float: none !important; display: block !important; }

/* ============================================================================= 30 YEARS EXHIBITION ========================================================================== */
.thirtyyears { font-size: 80%; background: #1266AD; color: white; padding: 0.7em 0; text-align: center; }
.thirtyyears h4 { font-size: 1.4em; margin: 0; }
.thirtyyears a { text-decoration: underline; color: white; }

.view.isotope.exhibition .views-row { width: 99.5%; }
.view.isotope.exhibition .item.text > .text.quotes-Yes { margin-bottom: 50px; }
.view.isotope.exhibition .item img { width: 100%; }

.fancybox-stage #content { max-width: 90%; }

.view.isotope.exhibition .item.text .quotes-Yes .content::after { bottom: 0px; }
