/* Running Squiz Matrix Developed by Squiz - http://www.squiz.net Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd Page generated: 16 July 2019 22:39:32 */ /** * version: 0.0.1 * file: wide.css * author: Squiz Australia * updated: 03-11-2015 20:05 * * Table of Contents * * Modules * ask-renata * events-topics * footer * header * main-content-inside * related-docs * rhs-ohs-additional * safety-net * search-bar * search-categories * search-results * slider * twitter-feed * union-form * breadcrumbs (0.0.2) * header-logo (0.1.0) * navbar (1.0.0-beta2) * quick-search (0.1.2) * secondary-nav (0.1.0) * slick (0.0.2) */ .slider__heading-slider1 .slider__heading-slider1-part1, .slider__heading-slider1 .slider__heading-slider1-part2 { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .l-wrapper { *zoom: 1; } .l-wrapper:before, .l-wrapper:after { content: ''; display: table; line-height: 0; } .l-wrapper:after { clear: both; } /* -------------------- Modules -------------------- */ /* This wrapper is on most modules and bower components throughout the index page of the site */ .main__inner-home { max-width: 77.8125rem; margin: 0 auto; padding: 0 1.25rem; } /* This fixes the margin top on the H2 image in the first hero slider */ .home .centre h2:first-of-type { margin-top: 0px; } /* This wrapper is around the "keep in touch" section of the index page */ .l-wrapper, .l-wrapper--index { display: table; margin: 0 2.5rem 2.5rem; max-width: 77.8125rem; margin: 0 auto; padding-bottom: 1.25rem; } /* Determines the layout for these components on the wide site */ .lhs, .rhs, .centre, .ask-renata, .twitter-feed, .union-form { display: table-cell; vertical-align: top; padding-bottom: 0; } .lhs, .rhs { width: 25%; max-width: 20rem; min-height: 1rem; } .l-wrapper { display: block; } .lhs, .rhs, .centre { display: block; float: left; } .centre { width: 50%; } /* Removes the margin from the first heading two on all inside pages */ .centre h2:first-of-type { margin-top: -0.3125rem; } .lhs h2:first-of-type { margin-top: -0.1875rem; } /* Additional layout specifications for the "keep in touch" components of the index page */ .ask-renata, .twitter-feed, .union-form { width: 33.3%; box-sizing: border-box; min-width: auto; min-height: auto; max-width: 33.3%; } .ask-renata { border-right: solid 1.25rem #000; } .union-form { border-left: solid 1.25rem #000; } .index__keep-in-touch { padding: 1.25rem 0; } /*-- module:ask-renata --*/ /* Styles for inside pages for 'Ask Renata' section */ .ask-renata--inside-pages { margin: 0 0.625rem; width: auto; border-right: 0; display: block; padding: 0 0 1.25rem 0; max-width: 100%; float: none; } .ask-renata__item { padding-bottom: 0; } /* Styles for index page for 'Ask Renata' section */ .ask-renata__heading { font-size: 6.75rem; line-height: 5.875rem; padding-top: 0.25rem; } .ask-renata__para { font-size: 1.375rem; } .ask-renata__link { height: 10.25rem; padding-top: 4.5rem; } /*-- module:events-topics --*/ /*-- module:footer --*/ /* Wide Styles for Footer */ .footer { height: 8rem; } .footer__site-attribution { padding-top: 2.5rem; } .footer__site-attribution p { margin-bottom: 0.625rem; } /*-- module:header --*/ /* Wide Styles for Header */ .header { height: 8.5rem; } .header__inner { position: relative; max-width: 77.8125rem; margin: 0 auto; } .header__search { right: 1.25rem; left: auto; } .header__menu { top: 5.625rem; right: 1.25rem; } /*-- module:main-content-inside --*/ /*-- module:related-docs --*/ /*-- module:rhs-ohs-additional --*/ .rhs-ohs-additional { margin: 0 0.625rem; width: auto; border-right: 0; display: block; padding: 0 0 1.25rem 0; max-width: 100%; min-width: auto; margin-bottom: 1.25rem; } .rhs-ohs-additional .main__inner-home { padding: 1.25rem 1.25rem 0; } /*-- module:safety-net --*/ .safety-net { padding: 0; min-height: auto; display: block; width: auto; min-width: auto; } .safety-net__heading { padding-top: 1rem; } /*-- module:search-bar --*/ .search-bar .main__inner-home { padding: 2.5rem 0; } .search-bar .search-bar__item { display: table; padding: 2.5rem 8%; width: 96.8%; margin: 0 1.25rem; } .search-bar .search-bar__heading { display: table-cell; width: 8.125rem; } .search-bar .search-bar__group { display: table-cell; width: auto; } /*-- module:search-categories --*/ .search-categories__wrapper { display: block; } .search-categories__content, .search-categories__documents { display: block; width: 100%; border: 0; } /*-- module:search-results --*/ /*-- module:slider --*/ /*-- module:twitter-feed --*/ .twitter-feed { padding-bottom: 0.75rem; } .twitter-feed__item { padding-bottom: 0; } /*-- module:union-form --*/ /* Styles for the Union form on the index page */ .union-form__lhs--wrapper { display: block; float: left; width: 59%; padding-bottom: 0.75rem; } .vthc-logo { margin: 0; float: right; width: 8.5rem; height: 8.5rem; } .union-form__form-wrapper { clear: left; } /*-- module:squiz-module-breadcrumbs --*/ .l-breadcrumb-wrapper { display: table; max-width: 77.8125rem; padding: 2.5rem 0 3.125rem; margin: 0 auto; width: 100%; } .breadcrumb-spacer, .breadcrumbs { display: table-cell; } .breadcrumb-spacer { width: 25%; } /*-- module:squiz-module-header-logo --*/ .header-logo { width: 12.25rem; height: 12.25rem; left: 1.25rem; top: 1.25rem; margin-left: 0; } /*-- module:squiz-module-navbar --*/ .navbar__toggle { display: none; } .navbar__dropdown[aria-expanded="false"] { display: block; position: relative; } .navbar__list { margin: 0; padding: 0; list-style: none; } .navbar__item { display: inline-block; *display: inline; zoom: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .navbar__item > a { -webkit-transition: background 0.3s ease; -moz-transition: background 0.3s ease; transition: background 0.3s ease; display: block; padding: .5em; } .navbar__item > a, .navbar__item > a:visited { text-decoration: none; } .navbar__item > a:hover, .navbar__item > a.active { background: #ccc; } .sub-nav { position: absolute; display: block; visibility: hidden; top: -9999em; overflow: hidden; -webkit-opacity: 0; -moz-opacity: 0; opacity: 0; -ms-filter: alpha(opacity=0); filter: alpha(opacity=0); -webkit-transition: opacity 100ms ease; -moz-transition: opacity 100ms ease; transition: opacity 100ms ease; -webkit-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); background: #fff; border: 1px solid #ccc; padding: .5em; } .no-js .navbar__item:hover .sub-nav, .no-js .navbar__item:focus .sub-nav, .navbar__item--active .sub-nav { visibility: visible; top: inherit; -webkit-opacity: 1; -moz-opacity: 1; opacity: 1; -ms-filter: alpha(opacity=100); filter: alpha(opacity=100); z-index: 1001; } .sub-mega-nav { left: 0; width: 100%; } .flexbox .sub-mega-nav .sub-nav__group { -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; } .no-js .sub-mega-nav .sub-nav__group, .no-flexbox .sub-mega-nav .sub-nav__group { display: table-cell; vertical-align: top; } .no-js .sub-nav__group-container, .no-flexbox .sub-nav__group-container { display: table; } .flexbox .sub-nav__group-container { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .navbar__dropdown { background-color: transparent; border-bottom: 0; text-align: right; margin-left: 0; margin-right: 0; } .navbar__item { max-width: 5.5rem; line-height: 1.25rem; border-bottom: 0; text-align: center; margin-left: 1.25rem; } .navbar__item a:hover, .navbar__item a:active { background-color: transparent; color: #fff; } .navbar__item:first-child { border-top: 0; } .navbar__dropdown[aria-expanded="false"] { display: block; } .sub-nav { height: auto; margin-top: -0.0625rem; min-width: 6.75rem; padding: 0; } .sub-nav a { padding: 0.625rem; text-align: left; } .sub-nav a:hover, .sub-nav a:focus { color: #000; background-color: #ffc700; } .sub-nav li:first-child { border-top: 0; } li.navbar__item:last-child .sub-nav { margin-left: -50px; } /*-- module:squiz-module-quick-search --*/ .expanded .quick-search { min-width: 17.75rem; } /*-- module:squiz-module-secondary-nav --*/ .nav { margin-top: 0; } .nav__item { display: block; } .nav__item-link:first-child { border-top: 0; } .nav__list { border-top: 1px solid #000; } /*-- module:squiz-module-slick --*/ .slick-slideshow--hero .slick-slideshow__slide { height: 23.5rem; background-position: center center; background-size: cover; } .slick-slideshow--hero .main__inner-home { margin: 0 auto; position: relative; height: 100%; } .slick-slideshow--hero .slick-slideshow__overlay { height: 23.5rem; } .slick-slideshow--hero .slick-dots { width: 100%; max-width: 77.8125rem; margin: 0 auto; text-align: left; padding-left: 3.25rem; right: 0; position: relative; margin-top: -1.625rem; } .slick-slideshow__slide--special .slick-slideshow__overlay:hover { background-color: rgba(255, 43, 0, 0.5); } .slider__text-content { padding: 1.25rem; left: auto; right: 8%; } .slider__text-content .slider__para--desktop-extra { display: block; line-height: 1.25rem; margin-bottom: 0.5rem; } .slider__text-content .slider__link { display: block; text-align: right; } .slider__heading-slider1 { background: transparent url("http://www.ohsrep.org.au/_designs/css/wide.css/ohs-reps-slogan.svg") 0 0 no-repeat; background-position: right bottom; height: 23.5rem; width: 100%; } .no-svg .slider__heading-slider1 { background-image: url("http://www.ohsrep.org.au/_designs/css/wide.css/ohs-reps-slogan.png"); } .slick-slideshow--hero .slick-next { position: absolute; top: 50%; margin-top: -20px; right: 0; } .slick-slideshow--hero .slick-prev { position: absolute; top: 50%; margin-top: -10px; left: 0; z-index: 1; background-color: transparent; border: 0; } /* Styles for Events and Hot Topics Slider */ .events-topics .events-topics__item { margin: 0; width: 100%; overflow: hidden; } .slick-slideshow__slide--event, .slick-slideshow__slide--topic { margin: 0; min-width: 24.875rem; margin-bottom: 1.25rem; height: 13.875rem; } .events-topics .main__inner-home { padding: 0; } /*.slick-slideshow__event-information, --- taken off because events don't have images */ .slick-slideshow__topic-information { width: 55.4%; } .slick-slideshow__event-image, .slick-slideshow__topic-image { width: 42.6%; height: 10.25rem; background-color: #ff2b00; } .events-topics .slick-slideshow__slide img:hover { transition: all 0.7s; opacity: 0.5; } .slick-slideshow__topic-image { float: left; } .slick-slideshow__topic-information { float: right; } .slick-slideshow__event-information p, .slick-slideshow__event-information a, .slick-slideshow__event-information h4, .slick-slideshow__event-information h5, .slick-slideshow__topic-information p, .slick-slideshow__topic-information a, .slick-slideshow__topic-information h4, .slick-slideshow__topic-information h5 { font-size: 0.875rem; line-height: 1.125rem; } .slick-slideshow__event-topic { margin: 0 -0.625rem; } .slick-slideshow__event-topic .slick-dots { margin-top: 0; margin-bottom: 0; } .slick-slideshow__event-information a, .slick-slideshow__topic-information a { top: 8.375rem; }