/**
 * @file
 * iPad width
 *
 * These styles override 320.css and 480.css
 *
 * Fonts: Roboto
 * Font weights: 400 (regular), 300 (light), 700 (bold)
 *
 * Colours:
 *  green:    #426059
 *  orange:   #f7931d
 *  red-pink: #b75454
 *  blue:     #425460
 *  gold:     #caab3d
 *  purple:   #604259
 *
 * @see 320.css
 * @see 420.css
 */
.css-size {
  display: none;
  content: '3';
  font-size: 3px !important;
  width: 3px !important;;
}
/**
 * HTML elements and generic site styling classes and IDs
 */

/* HTML elements **************************************************************/

article.node a {
  text-decoration: underline;
}
article.node a[href^="tel"],
article.node a[href^="mailto"] {
  text-decoration: none;
}
/* End: HTML elements */

/* Layout and generic styling *************************************************/

/* Layout */
.branding-block .wrapper,
#block-superfish-1,
#content,
#footer .footer-container {
  padding: 0 30px;
}
#page-wrapper {
  padding: 1.5em 0;
}
#sidebar-first {
  border-top: 2px solid #274A98;
  float: left;
  width: 25%;
}
.sidebar-first #content-main {
  width: 72%;
  float: right;
}
.sidebar-second #content {
  width: 67%;
  float: left;
}
#sidebar-second {
  float: right;
  width: 25%;
}
#content-top-region {
  overflow: hidden;
}
#content-left-region,
#content-right-region {
  clear: none;
  margin-top: 0;
  width: 48%;
}
#content-left-region {
  float: left;
}
#content-right-region {
  float: right;
}
#banner-image {
  display: block;
  margin-bottom: 1em;
}
/* Make sure the first element in the content are has no top menu. This is
important when the content starts with a <h2> which has a significant top
margin */
.field-name-body .field-item > *:first-child {
  margin-top: 0;
}
.max-60,
.max-70,
.max-80,
.max-90,
.max-100 {
  float: left;
}
.max-60 {
  width: 60%;
}
.max-70 {
  width: 70%;
}
.max-80 {
  width: 80%;
}
.max-90 {
  width: 90%;
}
.max-100 {
  width: 100%;
}
.screenshot {
  float: right;
  height: auto;
  margin: 0 0 1em 1em;
  width: 50%;
}
/* Audience buttons */

#audience .link-wrapper {
  display: table;
  border-collapse: separate;

  width: 100%;
}
.help-centre #audience a {
  width: 50%;
}
.help-centre #audience-old a {
  width: 50%;
}
.help-centre #audience a:first-child {
  padding: 1em 1em 1em 100px;
}
#audience a {
  background-position: left center;
  box-shadow: #666 0 0 8px;
  padding-left: 80px;
  transition: background-color .5s;
  vertical-align: middle;
}
.help-centre #audience a {
  background-position: right center;
  border-radius: 10px;
  box-shadow: #666 0 0 8px;
  display: table-cell;
  transition: background-color .5s;
  vertical-align: middle;
  width: 50%;
}
.help-centre #audience a:first-child {
  background-image: url('../images/button-tip-left.png');
  background-position: left center;
  padding: 1em 1em 1em 100px;
}
.front .front_news {
  margin-top: 10px;
}
#audience a.student:hover,
#audience a.student:focus {
  background: transparent url('../images/button-tip-left.png') left 0px center no-repeat;
  background-size: 60px auto;
}
#audience a.rto:hover,
#audience a.rto:focus {
  background: transparent url('../images/button-tip-right.png') right 0px center no-repeat;
  background-size: 60px auto;
}
#audience a.student:hover,
#audience a.student:focus {
  background-color: #4a5196;
  box-shadow: 6px 6px 6px #5e68b0;
}
.front #audience a.student:hover,
.front #audience a.student:focus {
  box-shadow: 8px 6px 6px #000;
}
.front #audience a.rto:hover,
.front #audience a.rto:focus {
  background-color: #cfbfc6;
  box-shadow: 8px 6px 6px #000;
}
#audience a.rto:hover,
#audience a.rto:focus {
  background-color: #455f96;
}
#audience a.developer:hover,
#audience a.developer:focus {
  background-color: #5BBCE6;
}
.front #audience a.developer:hover,
.front #audience a.developer:focus {
  box-shadow: 8px 6px 6px #000;
}
#audience a.other:hover,
#audience a.other:focus {
  background-color: #bbbbbb;
}
#audience .left {
  float: left;
  width: 50%;
}
#audience .right {
  float: left;
  width: 50%;
}
.front #audience h2 {
  border-bottom: solid 1px #ccc;
  color: white;
  font-weight: 400;
  margin: 0 1em 0 1em;
  text-shadow: black 0 0 20px;
}
.front #audience-old {
  margin: 75px auto 100px auto;
  width: 85%;
}
#audience-old a.rto {
  background-color: #90cfce;
  color: #253737;
}
#audience-old a ul:last-child {
  padding-right: 45px;
}
#audience-old a ul {
  margin: 0;
  padding: 0 50px 0 0;
}
.help-centre #audience-old .wrapper {
  display: table;
  border-collapse: separate;
  border-spacing: 2em;
  width: 100%;
}
.front #audience-old h2 {
  border-bottom: solid 1px #ccc;
  color: white;
  font-weight: 400;
  margin: 0 1em 0 1em;
  text-shadow: black 0 0 20px;
}
#audience-old .link-wrapper {
  display: table;
  border-collapse: separate;
  border-spacing: 2em;
  margin-bottom: 1em;
  width: 100%;
}
#audience-old a.student {
  background-color: #e7cd87;
  color: #342e1e;
}
.front #audience-old .audience-wrapper {
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 20px;
  padding: 1em;
}
.front #audience-old a {
  box-shadow: #333 0 0 10px;
}
#audience-old a.rto:hover, #audience-old a.rto:focus {
  background-color: #72D6D4;
}
#audience-old a:hover {
  transition: .5s;
}
#audience-old a {
  background-position: right center;
  border-radius: 10px;
  box-shadow: #666 0 0 8px;
  display: table-cell;
  transition: background-color .5s;
  vertical-align: middle;
  width: 50%;
}
/*#audience-old a {
    background: transparent url(/sites/all/themes/custom/usi2018_theme/images/button-tip-right.png) right 10px center no-repeat;
    background-size: 60px auto;
    display: block;
    font-size: 1.5em;
    font-weight: 300;
    line-height: 100%;
    margin-bottom: 1em;
    padding: 1em 2em;
    text-decoration: none;
}*/

#audience-old a:first-child {
  background-image: url(/sites/all/themes/custom/usi2018_theme/images/button-tip-left.png);
  background-position: left center;
  padding: 1em 1em 1em 100px;
}
#audience-old a ul:last-child {
  padding-right: 45px;
}
#audience-old a ul {
  margin: 0;
  padding: 0 50px 0 0;
}
#audience-old a.student:hover, #audience-old a.student:focus {
  background-color: #E8C66A;
}
.help-centre #audience-old h2 {
  text-align: center;
}
/* End: Layout and generic styling */

/**
 * Homepage
 */

.front {
  /*background: url('../images/hero.jpg') center center fixed no-repeat;*/
  background-size: cover;
}
.front #page-wrapper {
  max-width: 100%;
  padding: 0 2em;
}
.front #content-wrapper {
  margin: 0 auto 1em auto;
  max-width: 1020px;
}
.front #page-intro {
  background-color: rgba(255, 255, 255, 0.8);
  margin: 0 auto;
}
.front #page-intro .content-wrapper {
  margin: 0 auto;
  max-width: 700px;
}
.front footer {
  background-color: #2c3859;
}
.front div.tabs {
  background-color: #f6f6f2;
  border: solid 1px #d5d5ba;
  padding: 0.5em 1em;
}
.front #welcome {
  width: 100%;
  margin: 0;
}
.front #welcome h3 {
  margin-left:0;
}
.front #welcome div {
  width:100%;
  margin:0;
}
.front #welcome div.left,
.front #welcome div.middle,
.front #welcome div.right {
  padding: 0 5px;
  display: inline-block;
  margin:0;
  width:33%;
  float: left;
  padding: 0 2%;
}
.front #welcome div.left {
  width: 34%;
  padding-left:0;
}

.front #welcome_employer_content ul {
  margin-top:36px;
}

.front #welcome div.right {
  padding-right: 0;
}

/* End: homepage */

/**
 * Help centre
 */

.help-centre #audience h2 {
  text-align: center;
}
.help-centre #audience .wrapper {
  display: table;
  border-collapse: separate;
  border-spacing: 2em;
  width: 100%;
}
/* Generic help center form styling */

.help-centre #content form .container-inline {
  display: table;
  width: 100%;
}
.help-centre #content form#search-form .form-type-textfield,
.help-centre #content form#search-form .form-submit {
  display: table-cell;
}
.help-centre #content form input.form-submit {
  margin-top: 0;
}
/* Search form */

/* Views exposed form */

.help-centre .views-exposed-form .views-exposed-widgets {
  display: table;
  margin: 0;
  width: 100%;
}
.help-centre .views-exposed-form .views-exposed-widget {
  display: table-cell;
  float: none;
}
.help-centre #content form .views-exposed-form label,
.help-centre .views-widget-filter-field_topics_tid .views-widget {
  display: inline-block;
}
/* End: Help centre */

/* Contact landing page */

.contact #audience h2 {
  text-align: center;
}
/* End: Contact landing page */

/**
 * Main site functions and forms
 */

/* Search results *************************************************************/
/* End: Search results */

/* Forms **********************************************************************/
/* End: Forms */

/**
 * Template styling
 */

/* Section: Branding **********************************************************/

.branding-block .wrapper {
  margin: 0 auto;
  max-width: 1020px;
}

.branding-block .header-container {
  float: left;
  width: 60%;
}

/* Crest */

/* Logo */

/* Search Block */
.branding-block .search-container {
  float: left;
  max-width: 40%;
  margin-top: 5%;
}

#edit-search-block-form--2 + i {
  display: none;
}
.search-container {
  display: block;
}
.search-container .container-inline {
  height: 30px;
}
.mobile-buttons {
  display: none;
}
.mobile-search {
  display: none;
}
.search-container .container-inline .form-type-textfield {
  width: 92%;
}
form#search-block-form input[type="text"]{
  border: 1px solid #2d5b57;
  box-shadow: none;
  font-size: 1.2em;
  padding: .5em;
  display: block;
  width: 100%;
  margin: 0;
}

/* Search button */
#edit-submit--2 {
  margin: 0;
  padding: 0;
  border: 1px solid #2d5b57;
  border-left: none;
}


/* Home link */
.mobile-home {
  display: none;
}


/* End: Section: Branding */

/* Section: Header ************************************************************/
/* End: Section: Header */

/* Section: Navigation ********************************************************/
#navigation .home-icon-desktop,
#navigation .login-icon-desktop {
  display: block;
  font-size: 1.5em;
}
#navigation .home-icon-mobile,
#navigation .login-icon-mobile {
  display: none;
}
#navigation .header-container {
  margin: 0 auto;
  max-width: 1020px;
}
/* Hide the mobile menu links */
.toggle-menu,
ul.menu a.toggle-menu,
#navigation .toggle-menu {
  display: none;
}
/* Un-hide the menu which is hidden by default in mobile */
ul.menu.is-hidden {
  display: block;
  visibility: visible;
}
/* Main menu */
#navigation {
  display: block;
  background-color: #2d5b57;
}
#navigation ul {
  background: transparent;
  padding: 0;
}
#navigation li {
  float: left;
  margin: 0 1em 0 0;
  background-color: #253744;
}
#navigation li a {
  background-color: transparent;
  box-shadow: none;
  border: none;
  color: white;
}
#navigation li a.active-trail,
#navigation li.active-trail,
#navigation li a.active {
  background-color: #253744;
}
#navigation li a.active {
  background-color: #2D5B57;
}
#navigation li:hover {
  background-color: #253744;
}
#superfish-1 {
  line-height: 1.2em;
  list-style-type: none;
  padding: 0;
  display: table !important;
  width: 100%;
  table-layout: fixed !important;
  overflow: visible;
}
#superfish-1 > li {
  background-color: #2D5B57;
  padding: 0;
  margin: 0;
  float: none !important;
  display: table-cell !important;
  vertical-align: bottom;
  text-align: center;
  height: 57px;
}
#superfish-1 > li > a {
  padding: 7px 10px;
  margin: 0;
  height: 57px;
  vertical-align: middle;
  display: table-cell;
  text-align: center;
  line-height: 1.5em;
  width:138px;
}
#superfish-1 > li.last {
  width: 55px !important;
  max-width: 55px !important;
  background-color: #253744;
}
#superfish-1 > li.last:hover,
#superfish-1 > li.last a:focus {
  background-color: #2d5b57;
}
#superfish-1 > li > ul {
  margin-top: 25px;
}
#superfish-1 > li.active-trail > ul {
  margin-top: 19px;
}
#superfish-1 > li.active-trail > ul > li:first-of-type {
  border-top: 0;
}
#superfish-1 > li > ul > li {
  padding-right: 0;
  margin: 0;
  float: none !important;
  display: block;
  width: 320px;
  text-align: left;
}
#superfish-1 > li > ul > li > a {
  padding: 8px 0 8px 16px;
  display: inline-block;
  width: 100%;
  text-align: left;
}
#superfish-1 > li > ul > li > a:hover,
#superfish-1 > li > ul > li > a:focus {
  background-color: #2D5B57;
}
.mobile-menu-bar {
  display: none;
}
/* Sidebar menu */

/* End: Section: Navigation */

/* Section: Breadcrumb ********************************************************/
#breadcrumb {
  float: left;
}
#breadcrumb .inline {
  background-color: #eee;
  border-radius: 5px;
  padding: 5px;
}
#breadcrumb .delimiter {
  font-size: 20px;
}
#breadcrumb a:hover,
#breadcrumb a:focus {
  text-decoration: underline;
}
#readspeaker {
  float: right;
}
#readspeaker .rsbtn {
  margin: 0;
}
/* End: Section: Breadcrumb */

/* Section: Tabs **************************************************************/

div.tabs ul {
  padding: 0;
  border: solid 0 #d5d5ba;
  border-bottom-width: 1px;
}
div.tabs ul li {
  display: inline;
  margin-left: 1em;
}
div.tabs ul li a {
  background-color: #E6E6D9;
  border: solid 1px #d5d5ba;
  box-shadow: none;
  display: inline-block;
  padding: 0.3em 0.5em;
}
div.tabs ul li a.active,
div.tabs ul li a:hover {
  background-color: #f6f6f2;
  border: solid 1px #d5d5ba;
  border-bottom-color: #f6f6f2;
  font-weight: 400;
}
/* End: Section: Tabs */

/* Section: Footer ************************************************************/

.footer-nav {
  display: table;
  table-layout: fixed;
}
.footer-nav .block {
  display: table-cell;
  margin-top: 0;
  padding: 1em;
  /* Set an arbitary width for table-layout: fixed; */
  width: 10%;
}
footer h2 {
  font-size: 1.2em;
}
footer a:focus {
  outline: none;
  text-decoration: underline;
}
footer ul.menu li {
  padding: 0;
  margin: 0.3em 0 0 0;
}
/*footer ul.menu li a {
  padding: 0.25em 0;
}*/
/* End: Section: Footer */

/* Section: Top bar jump links ************************************************/
/* End: Section: Top bar jump links */

/* Section: Sidebars **********************************************************/

#sidebar-first .block-menu-block {
  border: none;
  padding: 0;
}
#sidebar-first ul.menu {
  padding: 0;
}
#sidebar-second {
  width: 33%;
  float: right;
}
#sidebar-second .block a {
  text-decoration: underline;
}
/* End: Section: Sidebars */

/**
 * Nodes
 */

/* Node: FAQ ******************************************************************/

.field-name-field-related-faqs .expand-container {
  overflow: hidden;
}
/* End: Node: FAQ */

/* Node: Alert ****************************************************************/
/* End: Node: Alert */

/**
 * Various styles applied to specific bits of markup
 */

/* Element: Boxed and blockquote **********************************************/
/* End: Element: Boxed and blockquote */

/* Element: Document download styles ******************************************/
/* End: Element: Document download styles */

/* Element: Goto top **********************************************************/
/* Element: End: Goto top */

/* Element: Tutorial lists ****************************************************/
/* End: Element: Tutorial lists */

/* Element: Minions ***********************************************************/
.front #minions {
  overflow: hidden;
}
.front #minions div.left {
  float: left;
  display: inline-block;
  width: 32%;
  margin-left: 1%;
}
.front #minions div.middle {
  float: left;
  display: inline-block;
  width: 32%;
  margin-left: 1%;
  margin-right: 1%;
}
.front #minions div.right {
  float: left;
  display: inline-block;
  width: 32%;
}
.front #minions .minion_box img {
  margin: 0;
  float: left;
  width: 35%;
}
.front #minions .minion_box ul.links_in_box {
  float: left;
  padding: 0;
  list-style: none;
  margin: 2em 0 0 0;
}
.front #minions a:hover,
.front #minions .minion_box h3:hover {
  text-decoration: underline;
}
.front #minions {
  padding: 0;
}
/* End: Element: Minions */

/**
 * Styling for blocks (non-views)
 */

/** Block: Top actions ********************************************************/

/** End: Block: Top actions */

/* Block: Creative commons ****************************************************/

#block-block-11 {
  margin-top: 1em;
}
/* End: Block: Creative commons */

/**
 * Styling for Views
 */

/* Generic views styling ******************************************************/
/* End: Generic views styling */

/* View: Outages **************************************************************/
/* End: View: Outages */

/* View: FAQ ******************************************************************/
/* End: View: FAQ */

/**
 * Styling for specific modules
 */

/* Module: USI Alert **********************************************************/

#block-usi-outages-outages {
  line-height: 100%;
}
/* End: Module: Alert */

/* Module: DEEWR Simple Image Gallery *****************************************/
/* End: Module: DEEWR Simple Image Gallery */

/* Module: DEEWR Media ********************************************************/
/* End: Module: DEEWR Media */

/* Module: DEEWR Table of Contents ********************************************/

#table-of-contents {

  border: none;
  float: right;
  margin: 0 0 1em 1em;
  max-width: 250px;
  min-width: 200px;
}
/* End: Module: DEEWR Table of Contents */

/* Module: DEEWR Last Modified ************************************************/

#block-deewr-last-modified-last-modified .last-modified {
  text-align: center;
}
/* End: Module: DEEWR Last Modified */

/* Module: Workbench **********************************************************/
/* End: Module: Workbench */

/* Structured Banners **********************************************************/
#structuredBanner {
  display: block;
  position: relative;
  width: 100%;
  background-color: #fff;
  overflow-x: auto;
  overflow-y: hidden;
  margin: 0 auto 20px;
}
#structuredBanner.banner1 {
  background: #fff url("/sites/usi/files/styles/structured_banners/banner_background_1.jpg") no-repeat bottom right;
}
#structuredBanner.banner2 {
  background: #4e615b url("/sites/usi/files/styles/structured_banners/banner_background_2.jpg") no-repeat bottom center;
}
.bannerLeft {
  float: left;
  width: 50%;
  padding: 25px;
  background-color: #fff;
}
.bannerLeft h1 {
  font-weight: bold;
}
.bannerLeft p {
  font-size: 1.2em;
}
.bannerContent1 {
  font-size: 1.3em;
  color: #4e615b;
  width: 47%;
  float: left;
  margin-bottom: 2em;
  background: url("/sites/usi/files/styles/structured_banners/banner_icon.png") no-repeat 30px 30px;
}
.bannerContent2 {
  color: #fff;
  margin-bottom: 2em;
  overflow: hidden;
  background: url("/sites/usi/files/styles/structured_banners/banner_icon_2.png") no-repeat 30px 30px;
}
.bannerContent1 h1 {
  font-size: 2.2em;
  font-weight: bold;
  color: #4e615b;
  margin: 40px 15px 25px 120px;
}
.bannerContent1 p {
  margin-left: 120px;
}
.bannerContent2 h1 {
  font-size: 1.8em;
  font-weight: bold;
  color: #fff;
  margin: 40px 25px 25px 120px;
}
.bannerContent2 p {
  margin-left: 120px;
}
.bold {
  font-weight: bold;
}
#block-superfish-1 {
  display: block;
}
.feedback-button {
  position: fixed;
  left: -47px;
  top: 50%;
  height: 30px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  margin: 0;
  padding: 0;
  z-index: 11;
  transition: all .5s;
  color: #FFFFFF;
  background-color: #396A73;
  background-repeat: no-repeat;
  cursor: pointer;
  /*background-size: contain;*/
}

/* Menu */
#menu-901-1 {
  width:59px;
}

/* Beta block */

#block-block-153 {
  padding: 0;
}

#block-block-153 .beta_block {
  padding: 0 30px;
}

#block-block-153 .beta_block_label {
  float:none;
}

#block-block-153 span.component-one {
  width: 80%;
  max-width: none;
  float:none;
  display: inline-block;
}

#block-block-153 span.component-two {
  top:33%;
  width:130px;
}

/* Remove top level items from submenus on desktop/tablet */

#superfish-1 > li > ul > li:first-child,
#superfish-1 > li > ul > li:first-child > a {
  display: none;
  visibility: hidden;
}
