/* ******************************************************* */
/*                                                         */
/*             This file should not be changed.            */
/* If changes are required - override in styles-layout.css */
/*                                                         */
/* ******************************************************* */

/* --------------- Toolbar settings ---------------- */
#toolbar-administration, 
#toolbar-administration * {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.1;
}
.toolbar .toolbar-icon-admin-toolbar-tools-help::before{
  background-size: 80% auto;
}
body.toolbar-fixed .toolbar-oriented,
.toolbar-oriented .toolbar-bar,
.toolbar-oriented .toolbar-tray {
  position: fixed;
  z-index: 501;
}
body.toolbar-vertical #header-wrap,
body.toolbar-horizontal #header-wrap { /* Move the fixed header down tablet & mobile if editor is logged in */
  top: 36px;
  top: 3.6rem;
}
body.toolbar-horizontal.toolbar-tray-open #header-wrap { /* Move the fixed header down desktop if editor is logged in */
 top:76px;
 top:7.6rem;
}
body.toolbar-tray-open.toolbar-vertical.toolbar-fixed, /* Move the whole body right on tablet & mobile if editor is logged in */
body.toolbar-tray-open.toolbar-vertical.toolbar-fixed #header-wrap { /* Move the fixed header right on tablet & mobile if editor is logged in */
  margin-left: 0; /* reset toolbar.css */
}
.toolbar-oriented .toolbar-tray-vertical {
  width: 50%;
}

/* --- Common Settings - Shouldn't need to adjust --- */
#header-wrap,
#slideshow-wrap,
#colmask-main,
#breadcrumb-wrap,
#footer-two-wrap,
#footer-three-wrap,
#footer-four-wrap,
#footer-bottom-wrap{
  width:100%;
  margin:0;
  padding:0;
}

/* --------------- Header styles ---------------- */
#header-wrap { /* header container to edge of screen */
  position:fixed;
  top:0;
  left:0;
  -webkit-backface-visibility:hidden; /*needed to make position:fixed work on android*/
  z-index:400;
}
.fixed-header #header-wrap { /* header container to edge of screen when scrolling */
  -webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.5);
  box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.5);
  /* border-bottom:1px solid #666; Remove comments on IE7 & IE8 */
}
.header { /* header container to edge of display area */
  padding-bottom:0; /* reset common settings to allow dropdowns to appear direct under navigation */
  clear:both;
}
/* .fixed-header .header {
} */
.header .block-system-branding-block {
  float: left;
  position: relative;
}
.logo-wrap { /* logo container */
  float:left;
  position:relative;
  text-align:left;
  line-height: 1;
}
.logo-wrap a { /* link inside logo container */
  width:100%;
  text-align:left;
  text-decoration:none;
  line-height:1;
}
/* .logo-wrap img { /* image inside logo container */
/* } */
.name-slogan { /* Site name and slogan container */
  padding:0;
  margin:0;
  text-align:left;
  float:left;
  position:relative;
}
.site-name,
.site-name h1,
.site-name h1 a,
.site-name a { /* Site name */
  text-decoration:none !important;
  line-height:1;
}
/* .site-slogan { /* Site slogan */
/* } */

/* --------------- column container ---------------- */
#colmask-main { /* Main content container to edge of screen */
}
.colmask { /* Main content container to edge of display area */
  background:none; /* full width column background colour */
  position:relative;
  clear:both;
  overflow:hidden;
}

/* --------------- slideshow ---------------- */
#slideshow-wrap { /* slideshow */
}
.slideshow { /* slideshow */
  clear:both;
  margin:0 auto;
}

/* --- common column settings - no need to adjust --- */
.colright,
.colmid,
.colleft {
  width:100%;
}
/* .full-col,
.col1,
.col2,
.col3,
.col4 {
} */

/* -------------------- Messages -------------------- */
.messages {
  margin-left: 8px;
}

/* --------------- 2 Column (Main Content Left) settings ---------------- */
/* .twocol-mainleft .colleft { /*column 1 (left column) */
/* } */
/* .twocol-mainleft .col1 { /*column 1 (left column) (shouldn't need any adjustments here for mobile) */
/* } */
/* .twocol-mainleft, 
.twocol-mainleft .col2 { /*column 2 (right column) */
/* } */
/* .content-top,
.content-bottom{
}
.sidebar-first {
}
.sidebar-second {
} */


/* --------------- Common Footer settings - no need to adjust ---------------- */
/* #footer-two-wrap,
#footer-three-wrap,
#footer-four-wrap,
#footer-bottom-wrap { /* footer containers to edge of screen */
/* } */
.footer-two,
.footer-three,
.footer-four,
.footer-bottom { /* main footer container in each footer-***-wrap  */
  clear:both;
}
.footer-two-bottom,
.footer-three-bottom,
.footer-four-bottom {
  clear:both;
}


/* --------------- Footer 2 Column Layout styles ---------------- */
/* #footer-two-wrap { /* top footer container to edge of screen */
/* } */
/* .footer-two { 
} */
.footer-two-top,
.footer-two-first,
.footer-two-second,
.footer-two-bottom { /* 2 column individual columns */
  padding:5px 0;
  padding:0.5rem 0;
}


/* --------------- Footer 3 Column Layout styles ---------------- */
/* #footer-three-wrap { /* top footer container to edge of screen */
/* } */
/* .footer-three { 
} */
.footer-three-top,
.footer-three-first,
.footer-three-second,
.footer-three-third,
.footer-three-bottom { /* 3 column individual columns */
  padding:5px 0;
  padding:0.5rem 0;
}


/* --------------- Footer 4 Column Layout styles ---------------- */
/* #footer-four-wrap { /* top footer container to edge of screen */
/* } */
/* .footer-four { 
} */
.footer-four-left,
.footer-four-right { /* secondary footer container in footer-four-top */
  width:100%;
  padding:0;
  margin:0;
}
.footer-four-top,
.footer-four-first, 
.footer-four-second,
.footer-four-third,
.footer-four-fourth,
.footer-four-bottom { /* 4 column individual columns */
  padding:5px 0;
  padding:0.5rem 0;
}


/* --------------- Footer Bottom Column Layout styles ---------------- */
/* #footer-bottom-wrap { /* bottom footer container to edge of screen */
/* } */
/* .footer-bottom-left,
.footer-bottom-right { /* secondary footer container in footer-bottom */
/* } */


/* --------------- Responsive Adjustments ---------------- */
/* Note, the CSS outside these Media Queries is used for all devices incl. mobiles */

@media only screen and (min-width: 320px) {
  /* Mobile & Small screen, non-retina */

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (-o-min-device-pixel-ratio: 2/1)  and (min-width: 320px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and (min-resolution: 192dpi) and (min-width: 320px),
only screen and (min-resolution: 2dppx) and (min-width: 320px) { 
  /* Mobile & Small screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 700px) {
  /* Tablet & Medium screen, non-retina */
  
  /* --------------- Toolbar settings ---------------- */
  body.toolbar-tray-open.toolbar-vertical.toolbar-fixed, /* Move the whole body right on tablet if editor is logged in */
  body.toolbar-tray-open.toolbar-vertical.toolbar-fixed #header-wrap { /* Move the fixed header right on tablet if editor is logged in */
    margin-left: 20%;
    width: 80%;
  }
  .toolbar-oriented .toolbar-tray-vertical {
    width: 20%;
  }

  /* --- Common Settings - Shouldn't need to adjust --- */

  
  /* --------------- Header styles ---------------- */

  
  /* --------------- column container ---------------- */

  
  /* --------------- slideshow ---------------- */

  
  /* --- common column settings - no need to adjust --- */
  .colright,
  .colmid,
  .colleft {
    float:left;
    position:relative;
  }
  .full-col {
    width:100%;
  }
  .col1,
  .col2,
  .col3,
  .col4 {
    float:left;
    position:relative;  
    width:auto;
  }

  /* -------------------- Messages -------------------- */

  /* --------------- 2 Column (Main Content Left) settings ---------------- */

  
  /* --------------- Common Footer settings - no need to adjust ---------------- */
  
  
  /* --------------- Footer 2 Column Layout styles ---------------- */
  .footer-two-first,
  .footer-two-second { 
    float:left;
    position:relative;
    width:48%;
    padding-right:4%;
  }
  .footer-two-second { 
    padding-right:0;
  }
  
  
  /* --------------- Footer 3 Column Layout styles ---------------- */
  .footer-three-first,
  .footer-three-second,
  .footer-three-third { /* 3 column footer background colour */
    float:left;
    position:relative;
    width:31%;
    padding-right:3.5%;
  }
  .footer-three-third { /* 3 column footer background colour */
    padding-right:0;
  }
  
  
  /* --------------- Footer 4 Column Layout styles ---------------- */
  .footer-four-left,
  .footer-four-right { /* secondary footer container in footer-four-top */
    width:50%;
    float:left;
    position:relative;
    margin:0;
    padding:0;
  }
  .footer-four-first, 
  .footer-four-second,
  .footer-four-third,
  .footer-four-fourth { /* 4 column individual columns */
    margin:0;
    padding-right:4%;
  }
  .footer-four-first,
  .footer-four-third { 
    padding-right:0;
  }
  
  
  /* --------------- Footer Bottom Column Layout styles ---------------- */
  .footer-bottom-left,
  .footer-bottom-right { /* secondary footer container in footer-bottom */
    width:50%;
    padding:0;
    float:left;
    position:relative;
  }


}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (-o-min-device-pixel-ratio: 2/1)  and (min-width: 700px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 700px),
only screen and (min-resolution: 192dpi) and (min-width: 700px),
only screen and (min-resolution: 2dppx) and (min-width: 700px) { 
  /* Tablet & Medium screen, retina, stuff to override above media query */

}

@media only screen and (min-width: 1024px) {
  /* Desktop & Large screen, non-retina */
  
  /* --------------- Toolbar settings ---------------- */


  /* --- Common Settings - Shouldn't need to adjust --- */


  /* --------------- Header styles ---------------- */
  .header { /* header container to edge of display area */
    max-width:1280px;
    margin:0 auto;        /* Centres the header left to right */
  }
  .logo-wrap { /* logo container */
  }
  .name-slogan { /* Site name and slogan container */
  }
  
  
  /* --------------- column container ---------------- */
  
  
  /* --------------- slideshow ---------------- */
  
  
  /* --- Common Settings - Shouldn't need to adjust --- */
  
  
  /* -------------------- Messages -------------------- */

  
  /* ----------------- 2 Column (Main Content Left) settings ------------------ */

  
  /* --------------- Common Footer settings - no need to adjust ---------------- */
  .footer-two,
  .footer-three,
  .footer-four,
  .footer-bottom { /* main footer container in each footer-***-wrap  */
    max-width:1280px;
    margin:0 auto;        /* Centres the webpage left to right */
  }
  
  
  /* --------------- Footer 2 Column Layout styles ---------------- */
  
  
  /* --------------- Footer 3 Column Layout styles ---------------- */
  
  
  /* --------------- Footer 4 Column Layout styles ---------------- */
  .footer-four-first, 
  .footer-four-second,
  .footer-four-third,
  .footer-four-fourth { /* 4 column individual columns */
    float:left;
    position:relative;
    width:46%; 
  }
  
  
  /* --------------- Footer Bottom Column Layout styles ---------------- */


}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1024px),
only screen and (min-resolution: 192dpi) and (min-width: 1024px),
only screen and (min-resolution: 2dppx)  and (min-width: 1024px) { 
  /* Desktop & Large screen, retina, stuff to override above media query */

}
@media only screen and (min-width: 1280px) {
  /* Desktop & Large screen, non-retina */

  /* --------------- Toolbar settings ---------------- */


  /* --- Common Settings - Shouldn't need to adjust --- */


  /* --------------- Header styles ---------------- */
  
  
  /* --------------- column container ---------------- */
  
  
  /* --------------- slideshow ---------------- */
  
  
  /* --- Common Settings - Shouldn't need to adjust --- */
  
  
  /* -------------------- Messages -------------------- */

  
  /* ----------------- 2 Column (Main Content Left) settings ------------------ */

  
  /* --------------- Common Footer settings - no need to adjust ---------------- */

  
  /* --------------- Footer 2 Column Layout styles ---------------- */
  
  
  /* --------------- Footer 3 Column Layout styles ---------------- */
  
  
  /* --------------- Footer 4 Column Layout styles ---------------- */
 
  
  /* --------------- Footer Bottom Column Layout styles ---------------- */


}

@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min--moz-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (min-width: 1280px),
only screen and (min-device-pixel-ratio: 2) and (min-width: 1280px),
only screen and (min-resolution: 192dpi) and (min-width: 1280px),
only screen and (min-resolution: 2dppx)  and (min-width: 1280px) { 
  /* Desktop & Extra Large screen, retina, stuff to override above media query */

}