/*  Title
**************************************************************

Theme: DSDPortal-Root

Description: Style sheet for the root site of the DSD Orchard portal

----
NOTE: To make modifications for your custom Application use the style sheet called "custom"
      DO NOT modify this style sheet!
----

*/


/*  Color Palette
**************************************************************

Background: #FFFFFF
Background-Header: #0062a9;
Background-Navbar: #393e47;
Background-Footer: #393e47;
Underline (Border-Bottom): #007DB3;
Text-White: #FFFFFF
Text-Grey: #555555
Links-Blue: #0076CC
Links-Blue Hover: #004A7F 
font-family: Arial, Helvetica, sans-serif;
*/


/* General
**************************************************************
**************************************************************/
@font-face {
    font-family: 'HelveticaNeue';
    src: url('fonts/HelveticaNeue.ttf') format('truetype');
}

html, body {
    min-height: 100%;
    min-height: -webkit-calc(100% - 100px); /* Chrome */
    min-height: -moz-calc(100% - 100px); /* Firefox */
    min-height: calc(100% - 100px); /* native */
    font-family: HelveticaNeue, Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    font-weight: 100;
    color: #555555;
}
#body {
    margin-top: 10px;
    margin-bottom: 80px;
    background: #fff;
}
.body-content {
    background: #fff;
    margin-left: 10px;
    margin-right: 10px;
}

/* -- Remove margins and fix width for all containers -- */
.container {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

/* Text */
h1 {
    border-bottom: 1px solid #12AAED;
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 2.0em;
    font-weight: 100;
}
h2 {
    border-bottom: 1px solid #12AAED;
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.8em;
    font-weight: 100;
}
h3 {
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.75em;
    font-weight: 100;
}
h4 {
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.5em;
    font-weight: 100;
}
h5 {
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.125em;
    font-weight: 100;
}
p {
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.0em;
    font-weight: 100;
    color: #555555;
}
a {
    /*font-family: Arial, Helvetica, sans-serif;*/
    font-size: 1.0em;
    font-weight: 100;
    color: #0076CC;
}
a:hover {
    color: #004A7F;
}

/* Buttons */
.btn {
    border-radius: 0;
}

.btn-home {
    padding: 8px 25px;
}

/* Navbar */
.navbar {
    border: 1px solid #393e47;
    display: none;
}
    .navbar.navbar-main {
        display: block;
    }

/* Portal header, Main SA logo and portal navigation
   (Menu Items for all the portal)
**************************************************************
**************************************************************/

.header-container {
    color: white;
    padding: 20px 0 20px 0;
    border-bottom: 1px solid #007DB3;
    background: #0062a9;
    background: linear-gradient(135deg, #0062a9 0%, #00243E 100%);
}

.table > .row {
    width: auto;
    margin-left: 5px;
    margin-right: 5px;
}

@media (max-device-width: 770px) {
        .header-container {
        padding: 12px 0 8px 0;
        }
    } 
.portal-header-container {
    margin: 0;
    padding: 15px;
    border-bottom: 1px solid #007DB3;
    background-color: #0062a9;
}
.portal-header {
    margin: 0;
}

    /* Shrink vertical height of portal Header bar for Mobile Devices */
    /* iPhone 6 and below */
    @media (max-device-height: 414px) {
        .header-container {
        padding: 2px;
        }
    } 
    
    @media (max-device-width: 414px) {
        .container {
            padding: 0 10px;
        }
    }

/* Left header */
#portal-header-left {
    margin-top: 0;
    padding: 4px 0;
}

/* SA Gov logo */
    
    @media (max-device-width: 414px) {
        .img-sa-gov {
            padding-right: 10px;
            margin-left: -120px;
            max-width: 160%;
        }
    }
    @media (max-device-width: 375px) {
        .img-sa-gov {
            padding-right: 10px;
            margin-left: -110px;
            max-width: 160%;
        }
    }
    @media (max-device-width: 320px) {
        .img-sa-gov {
            padding-right: 10px;
            margin-left: -92px;
        }
    }

/* Right header */
#portal-header-right {
    /* float: right; */
    text-align: right;
    /* margin-top: 0; */
    /* margin-bottom: 0; */
    padding: 0 0 0 0;
    color: #FFFFFF;
    /* margin: auto 0; */
}

    /* Adjust Right Header (User and Menu Items) for Mobile Devices */
    @media (max-width: 768px) {
        #portal-header-right {
        padding: 0 0 0 0;
        }
    }

    /* Adjust Right Header (User and Menu Items) for Mobile Devices */
    @media (max-width: 768px) {
        .portal-nav {
        padding-right: 2px;
        }
    }

/* Portal menu button */
#toggle-portal {
  display: block;
  width: 28px;
  height: 25px;
  margin-top: 0;
  padding-top: 5px;
  float: right;
}
#toggle-portal span:after,
#toggle-portal span:before {
  content: "";
  position: absolute;
  left: 0;
  top: -9px;
}
#toggle-portal span:after{
  top: 9px;
}
#toggle-portal span {
  position: relative;
  display: block;
}
#toggle-portal span,
#toggle-portal span:after,
#toggle-portal span:before {
  width: 100%;
  height: 5px;
  background-color: #FFFFFF;
  transition: all 0.3s;
  backface-visibility: hidden;
  border-radius: 2px;
}

    /* on activation */
    #toggle-portal.on span {
        background-color: transparent;
    }
    #toggle-portal.on span:before {
        transform: rotate(45deg) translate(5px, 5px);
    }
    #toggle-portal.on span:after {
        transform: rotate(-45deg) translate(7px, -8px);
    }
    #toggle-portal.on + #portal-menu {
        opacity: 1;
        visibility: visible;
    }

/* Menu appearance */
#portal-menu {
  position: absolute;
  right: 0;
  width: 300px;
  padding: 10px;
  margin-top: 90px;
  text-align: center;
  border-radius: 4px;
  background: white;
  box-shadow: 0 1px 8px rgba(0,0,0,0.05);
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s;
  z-index: 2;
}
#portal-menu:after {
  position: absolute;
  top: -15px;
  right: 5%;
  content: "";
  display: block;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 20px solid white;
}
    /* iPhone 6 plus */
    @media(max-width: 414px){
        #portal-menu {
            margin-top: 75px;            
        }
        #portal-menu:after {
            top: -12px;
            right: 1%;            
        }
    }
    
    /* iPhone 6 */
    @media(max-width: 375px){
        #portal-menu {
            margin-top: 75px; 
        }
        #portal-menu:after {
            top: -12px;
            right: 1%;  
        }
    }    

    /* iPhone 4 & 5 */
    @media(max-width: 320px){
        #portal-menu {
            width: 320px;
            margin-top: 75px;             
        }
        #portal-menu:after {
            top: -12px;
            right: 1%;  
        }
    }    

#portal-menu div ul {
  list-style: none;
  display: block;
  margin: 0;
  padding: 0;
}
#portal-menu div ul li, li a {
  list-style: none;
  display: block;
  margin: 0;
  padding: 0;
}
li a {
/* width: 70px; */
  padding: 5px;
/*   color: #555555; */
  text-decoration: none;
  transition: all .2s;
}
li a:hover,
li a:focus {
  color: #002d62;
  text-decoration: underline;
}
.portal-menu-top {
    border-bottom: 1px solid #12AAED;
}
.portal-menu-top ul {
    margin-left: 5px;
    margin-right: 5px;
}
.portal-menu-top li {
    padding: 10px;
    text-align: left;
}
.portal-menu-top li a {
    border-radius: 4px;
    text-shadow: 1px 1px 10px #C0C0C0;
    text-align: center;
}
.portal-menu-top li a:hover {
    text-shadow: none;
}
.portal-menu-main {
    margin-top: 20px;
}
.portal-menu-main li {
    margin-bottom: 10px;
}
.portal-menu-main li a {
    border-radius: 4px;
}

/* User & Account related */
.user-display {
    margin: 15px 0;
}
.user-display a {
    /* padding: 2px 0; */
    text-decoration: none;
    color: white;
    display: block;
    min-height: 100%;
}
.user-display a:hover {
    /* padding: 2px 0; */
    text-decoration: none;
    color: white;
}
.user-display a:active {
    text-decoration: none;
    color: #FFFFFF;
}
.user-sign-in a {
    float: right;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 0;
    padding: 5px 30px;
    color: rgba(255, 255, 255, 0.9);
}
    @media (max-device-width: 768px) {
        .user-sign-in a {
        font-size: 0.8rem;
        padding: 0 0 15px 0;
        }
    }
.user-sign-in a:hover {
    color: rgba(255, 255, 255, 1);
}

        
.user-name {
    font-size: 1.2rem;
    font-weight: 100;
    padding-right: 5px;
    max-height: 20px;
    /* vertical-align: middle; */
}
   
    /* Hide User Name for Mobile Devices */
    @media (max-width: 770px) {

    .navbar.navbar-main {
       display: none;
    }
        .user-name {
          font-size: 1em;
        /* display: none; */
        }
    }

/* User Icon */
.glyphicon {/* top: 0; */display: inline;}
.glyphicon-user {
    max-height: 20px;
    font-size: 1.3rem;
}
    
    /* -- Change User Icon for Mobile Devices -- */
    /* iPads */
    @media (max-width: 768px) {
        .glyphicon-user {
            /* padding: 20px 8px 20px 20px; */
            font-size: 1.2rem;
        }
        .user-display a {
            border: none;
            margin: 0 10px;
        }
        .user-display a:active {
            text-decoration: none;
        }
        .user-display a:hover {
            text-decoration: none;
            border: none;
        }
    }
    
    /* iPhone 6plus */
    /*
    @media (max-width: 414px) {
        .user-actions {
           width: 97%;
           top: 0 !Important;
           font-size: 0.9em;
           right: 12px !Important;
        }
        .user-actions-menu {
           float: left !Important;
           padding-left: 30px !Important;
        }
    }
    */
        
    /* iPhone 6 */
    /*
    @media (max-width: 375px) {
        .user-actions {
           width: 97%;
           top: 0 !Important;
           font-size: 0.9em;
           right: 12px !Important;
        }
        .user-actions-menu {
           float: left !Important;
           padding-left: 13px !Important;
        }
    }
    */

    /* iPhone 4 & 5 */
    /*
    @media (max-width: 320px) {
        .user-actions {
           width: 96%;
           top: 0 !Important;
           font-size: 0.8em;
           right: 13px !Important;
        }
       .user-actions-menu {
           float: left !Important;
           padding-top: 12px !Important;
           padding-left: 0 !Important;
        }
    }
    */

    /* Hide user actions prior to jQuery toggle */
    .user-actions {
        visibility: visible;
        display: none;
    }

.user-actions {
    position: fixed;
    height: 72px;
    top: 6px;
    right: 14px;
    padding-left: 20px;
    border: 1px solid #FFFFFF;
    border-radius: 0;
    background-color: #FFFFFF;
    color: #555555;
    z-index: 2;
}
.user-actions a {
    display: inline;
    padding: 0 10px;
    color: #555555;
}
@media (max-width: 320px) {
            .user-actions a {
                font-size: 0.8rem;
            }
        }
.user-actions a:hover {
    color: #555555;
    padding: 0 10px;
    text-decoration: underline;
}

/* -- Close menu items -- */
.user-actions-close {
    float: right;
    display: none;
    background-color: #FFFFFF;
    color: #FFFFFF;
    padding-left: 1px;
}
a.user-actions-close {
    color: #0062a9;
}
a.user-actions-close:hover {
}
.close-text {
    font-size: 0.7em;
}

/* Menu items */
.user-actions-menu {
    padding-top: 25px;
    display: flex;
    float: right;
    padding-right: 5px;
}

/* Site title
**************************************************************/

.site-title-container {
    margin-left: 0;
    margin-right: 0;
    padding: 5px 20px 5px 20px;
    background-color: #393e47;
    color: #FFFFFF;
}
    /* Reduce left and right padding for mobile devices */
     /* iPhone 6 plus & below*/
    @media (max-width: 414px) {
        .site-title-container {
            padding: 10px 10px 10px 10px;
        }
    }

    /* Home Page specific styles
    ****************************/
    /*.site-title-container-home {
        margin-left: 0;
        margin-right: 0;
        padding-top: 15px;
        padding-bottom: 10px;
        padding-left: 0;
        padding-right: 0;
        border-bottom: 1px solid #007DB3;
        background-color: #393e47;
        color: #FFFFFF;
    }*/

    /* Remove margins and padding on Mobile */
        /*@media (max-width: 529px) {
            .site-title-container-home {
                padding-top: 0;
                padding-bottom: 0;
            }
        }*/

    /* END - Home Page specific styles */


.site-title {
    padding-top: 0;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 0;
    color: #FFFFFF;
}

    /* Home Page specific styles */
    .site-title-home {
        padding: 0 0 0 0;
    }

/* Text */
.site-title-txt {
    font-weight: 300;
    font-size: 2.0em;
    display: inline;
    /* padding: 18px 5px 18px 0; */
}
.site-title a {
    color: #FFFFFF;
}
    /* Shrink site title text for mobile */
    @media (max-width: 529px) {
        .site-title-txt {
            font-size: 2.8em;
        }
    }
    @media (max-width: 432px) {
        .site-title {
            font-size: 0.5em;
        }
    }



/* Site header and navigation (Menu Items for individual site)
**************************************************************
**************************************************************/

.navigation-container {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    border-bottom: 1px solid #007DB3;
}

/* Bootstrap navigation */
.navbar-main {
    background: #393e47;
    border-radius: 0;
}
.navbar {
    margin-bottom: 0;
}
.navbar-main .dropdown-menu {
    border: none;
}
.navbar-main .navbar-nav > li > a {
    font-size: 1em;
    /* padding: 15px 14px; */
    border: none;
    color: #ffffff;
}
.navbar-main .navbar-nav > li.open > a,
.navbar-main .navbar-nav > li.open > a:hover,
.navbar-main .navbar-nav > li.open > a:focus {
    background-color: transparent;
    color: #393e47;
}
.navbar-main .yamm-content ul li a {
    display: block;
    padding: 8px;
    border-bottom: 1px solid #555555;
}
.navbar-main .yamm-content ul li a:hover {
    background: #dee7ed;
}
.nav-columns-container {
    padding-left: 10px;
    padding-right: 10px;
}
.nav-columns {
    /* float: left; */
    padding: 0;
    list-style: none;
    margin-left: 0;
}


/* Custom navigation */
.navbar-custom {
    /* margin-bottom: 0; */
    padding: 0 0 0 0;
    min-height: 0;
    font-size: 0.9em;

    /* show via jQuery */
    display: none;
}
.navbar-custom .navbar-nav > li > a {
    padding-left: 20px;
    padding-top: 0; 
    padding-bottom: 10px;
    color: #FFFFFF;
}
    /* Mobile Padding */
    /* iPhone 6+ and below */
    @media(max-device-width: 767px) {
        .navbar-custom .navbar-nav > li > a {
            /* padding-top: 8px; */
            padding-bottom: 25px;
        }
    }
    
.navbar-custom .navbar-nav > li > a:hover, .nav > li > a:focus {

    border-radius: 4px;
    background-color: transparent;
    color: #FFFFFF;
    text-decoration: underline;
}
    /* Mobile Padding */
    /* iPhone 6+ and below */
    /*
    @media(max-device-width: 767px) {
        .navbar-custom .navbar-nav > li > a:hover, .nav > li > a:focus {
            padding-top: 8px;
            padding-bottom: 8px;
        }
    }
    */
/* dropdown text */
.navbar-custom .navbar-nav > li > a.dropdown-toggle {
    padding-top: 0;
    padding-bottom: 0;
    background: transparent !Important;
}
    /* Mobile Padding */
    /* iPhone 6+ and below */
    @media(max-device-width: 767px) {
        .navbar-custom .navbar-nav > li > a.dropdown-toggle {
            padding-top: 8px;
            padding-bottom: 8px;
        }
    }
    
.navbar-custom .navbar-nav > li > a.dropdown-toggle:hover {
    padding-top: 0;
    padding-bottom: 0;
    background: transparent !Important;
    color: #FFFFFF;
    text-decoration: underline;
}
    /* Mobile Padding */
    /* iPhone 6+ and below */
    @media(max-device-width: 767px) {
        .navbar-custom .navbar-nav > li > a.dropdown-toggle:hover {
            padding-top: 8px;
            padding-bottom: 8px;
        }
    }
    
.navbar-custom .navbar-nav > li > a.dropdown-toggle:focus {
    padding-top: 0;
    padding-bottom: 0;
    background: transparent !Important;
    color: #FFFFFF;
    text-decoration: underline;
}
    /* Mobile Padding */
    /* iPhone 6+ and below */
    @media(max-device-width: 767px) {
        .navbar-custom .navbar-nav > li > a.dropdown-toggle:focus {
            padding-top: 8px;
            padding-bottom: 8px;
        }
    }
    
    /* selected dropdown menu item (title of 2nd level items) */
    .navbar-main .navbar-nav > li.open > a, .navbar-main .navbar-nav > li.open > a:hover, .navbar-main .navbar-nav > li.open > a:focus {
        color: #FFFFFF;
    }
    /* down arrow on dropdowns */
    .navbar-custom .navbar-nav > li > a > b.caret {
        border-top-color: #FFFFFF;
        border-bottom-color: #FFFFFF;
    }
.navbar-custom .navbar-nav > li > a > b.caret:hover, .nav > li > a > b.caret:focus {
    border-top-color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}
.navbar-custom .navbar-nav > li > a:hover b.caret {
    border-top-color: #FFFFFF;
    border-bottom-color: #FFFFFF;
}
.navbar-custom .navbar-nav > li > .dropdown-menu {
    background: #FFFFFF;
    color: #555555;
}
.navbar-custom .navbar-nav > li > .dropdown-menu a {
    color: #555555;
}
.navbar-custom .navbar-nav > li > .dropdown-menu a:hover {
    border-radius: 4px;
    background-color: #0062A9;
    text-decoration: underline;
    color: #FFFFFF;
}
#mNavBar {
    padding: 0;
}

.yamm .container {
    padding-left: 5px;
    padding-right: 5px;
}


/* Second level drop down navbar items */
    /* background of second level items */
    .yamm-content {
        background: #393e47;
    }
    .yamm .yamm-content {
    padding: 10px 0 10px 0;
    }
    /* padding around area of second level items */
    .dropdown-menu {
        padding: 0;
    }
    /* stops second items area dropdown from the dropdown title link - this removes full width
       (Comment this out to make the second level full width) */
    .yamm .dropdown.yamm-fw .dropdown-menu {
    left: inherit;
    right:inherit;
    }
    /* second level items */
    .navbar-custom .navbar-nav > li > .dropdown-menu a {
    color: #FFFFFF;
    padding: 10px 5px;
    }
    /* second level items background colour */
    ul.dropdown-menu li a:hover {
        background: #0062A9 !Important;
    }	

/* Hide the mobile hamburger icon row*/
.navbar-header {
    display: none !important;
}

/* site menu btn (down arrow) on nav bar */
.site-menu-btn {
    /* margin-top: 0; */
    /* padding-left: 15px; */
    /* display: inline-block; */
    /* vertical-align: text-bottom; */
    float: right;
    padding: 2px 5px;
    border: 1px solid #666666;
    color: #FFFFFF;
}
.site-menu-btn.grey {
    color: #888888;
}

.menu-dropdown-btn {
    display: inline;
    padding-right: 10px;
    color: #FFFFFF;
    font-size: 1.1rem;
    font-weight: 100;
}
/*Menu Down Arrow */
.glyphicon-chevron-down {
    font-size:1.0rem;
    top: 3px;
}
    /* jQuery rotation of site menu btn */
    .rotate{
        -moz-transition: all 0.4s linear;
        -webkit-transition: all 0.4s linear;
        transition: all 0.4s linear;
}
    .rotate.down{
        -moz-transform:rotate(180deg);
        -webkit-transform:rotate(180deg);
        transform:rotate(180deg);
    }

/* Hide the Menu Button for desktop */
.site-menu-btn {
    display: none;
}
/* Show the Menu Button for mobile */
    @media (max-width: 769px) {
        .site-menu-btn {
            display: inline;
        }
    }


/* Support navigation items */
.sitenav-support {
    display: inline-block;
    float: right;
    padding: 0 0;
}
li.dropdown a.dropdown-toggle:hover {
    background-color: #FFFFFF;
    text-decoration: underline;
    color: #0062A9;
}
li.dropdown a.dropdown-toggle:active {
    background-color: #FFFFFF;
    text-decoration: underline;
    color: #0062A9;
}
li.dropdown a.dropdown-toggle:focus {
    background-color: #FFFFFF;
    text-decoration: underline;
    color: #0062A9;
}
ul.dropdown-menu li a {
    color: #0062A9;
}
ul.dropdown-menu li a:hover {
    background-color: white;
    text-decoration: underline;
    color: #0062A9;
}



/*  Main Body
**************************************************************
**************************************************************/

.main-body {
    padding-left: 15px;
    padding-right: 15px;
}

    /* remove main body padding on mobile */
    @media (max-width: 529px) {
        .main-body {
            padding-left: 0;
            padding-right: 0;
        }
    }

    /* remove title and description on mobile */
    @media (max-width: 529px) {
        .main-body header {
            display: none;
        }
    }

.body-container {
    padding: 0 0;
}

/* Hide Published Date in content area */
.published {
    display: none;
}



/*  Buttons
**************************************************************
**************************************************************/

.btn-blue {
    background-color: #0062A9;
    border-color: #0062A9;
    color: #FFFFFF;
}
.btn-blue:hover {
    background-color: #FFFFFF;
    border-color: #0062A9;
    color: #004A7F;
    text-decoration: underline;
}
    /* Hide on desktop */
    @media (max-width: 529px) {
        #non-mobile {
            display: none;
        }
    }



/*  Footer
**************************************************************
**************************************************************/

.footer-custom{
    background-color: #393e47;
    color: #FFFFFF;
    z-index: 2;
}
.footer-container {
    margin: 0;
    padding: 0 20px 0 20px;
    width: 100%;
}
.footer-right {
    padding-top: 8px;
    padding-bottom: 5px;
}
.footer-left {
    padding-top: 8px;
    padding-bottom: 5px;
}

    /* Footer for desktop */
    .footer-fixed {
        position: fixed;
        bottom: 0;
        width: 100%;
        /* Set the fixed height of the footer here */
        height: 35px;
    }

    /* Footer for mobile */
    .footer-not-fixed {
        position: relative;
        width: 100%;
        /* Set the fixed height of the footer here */
        height: 55px;
    }

/* Footer - Copyright & legal text & SA logo */
.dsd-copyright {
    padding-left: 0; 
}
.dsd-copyright a {
    font-size: 0.8em;
    font-weight: 100;
    color: white;
}
a.copyright {
    text-decoration: none;
    color: #FFFFFF;
}
a.copyright:hover {
    text-decoration: underline;
    color: #FFFFFF;
}
a.copyright:active {
    text-decoration: none;
    color: #FFFFFF;
}
    /* Shrink copyright for Mobile */
    /* Other links down a line */
    @media (max-width: 480px) {
        .copyright {
            display: block;
        }
    }
    
.footer_seperator {
padding-left: 10px;
padding-right: 10px;
}

    /* Hide the first seperator after the copyright element has forced other footer links onto another line */
    @media (max-width: 480px) {
        .footer_seperator:nth-child(2) {
            /* float: right; */
            padding-top: 10px;
            display: none;
        }
    }
    /* Hide the link seperator "|" */
    .footer_seperator {
        visibility: hidden;
    }
    
.privacy {
    color: #FFFFFF;
}
a.privacy {
    text-decoration: none;
    color: #FFFFFF;
}
a.privacy:hover {
    text-decoration: underline;
    color: #FFFFFF;
}
a.privacy:active {
    text-decoration: none;
    color: #FFFFFF;
}
    /* Shrink privacy for Mobile */
    /* iPhone 6 plus */
    @media (max-width: 414px) {
        .privacy {
            font-size: 0.9em;
        }
    }
     /* iPhone 6 */
    @media (max-width: 375px) {
        .privacy {
            font-size: 0.8em;
        }
    }
     /* iPhone 5 & below */
    @media (max-width: 320px) {
        .privacy {
            font-size: 0.7em;
        }
    }

    /* Hide the privacy link */
    .privacy {
        visibility: hidden;
    }
    
.disclaimer {
    color: #FFFFFF;
}
a.disclaimer {
    text-decoration: none;
    color: #FFFFFF;
}
a.disclaimer:hover {
    text-decoration: underline;
    color: #FFFFFF;
}
a.disclaimer:active {
    text-decoration: none;
    color: #FFFFFF;
}
    /* Shrink disclaimer for Mobile */
     /* iPhone 6Plus */
    @media (max-width: 414px) {
        .disclaimer {
            font-size: 0.9em;
        }
    }
     /* iPhone 6 */
    @media (max-width: 375px) {
        .disclaimer {
            font-size: 0.8em;
        }
    }
     /* iPhone 5 & below */
    @media (max-width: 320px) {
        .disclaimer {
            font-size: 0.7em;
        }
    }
    
    /* Hide the disclaimer link */
    .disclaimer {
        visibility: hidden;
    }
    
.footer-sa-logo {
    margin: 0;
    padding: 0 0;
    padding-bottom: 10px;
}
    
    
   /* Move footer Items when NOT Mobile sized device */
    @media (min-width: 992px) {
        .footer-sa-logo {
            float: right;
        }
    }

    /* Shrink Copyright font for Mobile Device */
    @media (max-width: 768px) {
        a.copyright {
            font-size: 0.9em;
        }
    }
    
    /* Shrink privacy font for Mobile Device */
    @media (max-width: 768px) {
        a.privacy {
            font-size: 0.9em;
        }
    }

    /* Shrink disclaimer font for Mobile Device */
    @media (max-width: 768px) {
        a.disclaimer {
            font-size: 0.9em;
        }
    }

    /* Hide mobile footer */
    .footer-custom-mobile {
        display: none;
        background-color: #393e47;
        margin-top: 40px;
    }

    /* Show mobile footer */
    /* Nexus 6P (Horizontal) */
    @media (max-device-width: 773px) {
        .footer-custom-mobile {
            display: block;
        }
        .footer-custom {
            display: none;
        }
    }       

    /* Hide desktop footer */
    /* iPhone 6 plus & below */
  /*   @media (max-device-width: 768px) {
        .footer-custom {
            display: none;
        }
    }  */  
     
    /* Adjust footer container padding after responsive moves to small screen size */
    @media (max-width: 992px) {
        .footer-container {
            padding: 8px 15px;
        }
    }

    /* Adjust #body margin on mobile footer so it locks to bottom of screen */
    @media (max-width: 768px) {
        #body {
            margin-top: 5px;
            margin-bottom: 0;
        }
    }



/* Utilities
**************************************************************
**************************************************************/

.no-margin {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
}
.no-padding {
    padding-left: 0;
    padding-right: 0;
}
.width-full {
    width: 100%;
}

/* Remove bold tag from text */
.not-bold {
    font-weight: 100;
}

/* Force items to be hidden */
.display-none {
    display: none !important;
}

/* Hide elements when in desktop view */
.hide-mobile {
    display: none;
}

/* Force items to display as block elements */
.display-block {
    display: block !important;
}

/* Force items to display as inline elements */
.display-inline {
    display: inline !important;
}



/*  Home page content
**************************************************************
**************************************************************/

/* Main content area */
.intro-section {
    margin-top: 15px;
}
    /* Remove padding on Mobiles */
    @media (max-width: 529px) {
        .intro-section {
            margin-top: 0;
        }   
    }

.main-box {
    margin-top: 20px;
    padding-left: 40px;
    padding-right: 40px;
}
    /* Remove padding on Mobiles */
    @media (max-width: 529px) {
        .main-box {
            margin-top: 0;
            padding-left: 0;
            padding-right: 0;
        }   
    }

/* Secondary content area (Help & Support section - Right side of main content) */
.sub-box {
    margin-top: 0;
    padding-left: 40px;
    padding-right: 40px;
    float:right
}
    /* Remove padding on Mobiles */
    @media (max-width: 529px) {
        .sub-box {
            padding-left: 0;
            padding-right: 0;
        }   
    }

/* -- Home Screen Icons -- */
.icons {
    margin: 0;
    padding: 30px;
}
.icons img {
    border: 1px solid #54565B;
}

/* --- Font page title/header --- */
.font-page-header {
    border-bottom: 1px solid #0085E5;
}

/* --- Home sceen blue box --- */
.intro {
    padding: 20px 40px 10px 40px;
    background: #002d62;
    color: #ffffff;
}
    /* Change intro padding on mobile */
    @media (max-width: 529px) {
        .intro {
            padding: 20px 30px 10px 30px;
        }
    }
.intro h1 {
    margin: 0 0 20px 0;
    padding-right: 60px;
    padding-bottom: 0;
    font-size: 1.87em;
    border: none;
    color: #ffffff;
}
.intro p {
    color: #FFFFFF;
}
.intro ul {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
    margin-left: -15px;
    margin-right: -15px;
}
.intro ul li {
    margin: 0;
}
.intro ul li a {
    color: #ffffff;
    display: block;
    padding: 8px 15px;
    font-size: 1.2em;
    /*font-family: "Open Sans", "myriad-pro-n3", "myriad-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    font-weight: 300;
    border-bottom: 1px solid #114578;
}

/* --- Home Screen Image Carousel --- */
/*media screen*/
.flexslider .slides img {
    width: 100%;
    display: block;
}
/*@media all and (min-width:992px)*/
.flexslider .overlay {
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    padding: 25px 30px 15px 30px;
    background-color: #192028;
    background-color: rgba(0, 0, 0, 0.7);
    background-color: #2d7501;
    background-color: rgba(45, 117, 1, 0.8);
    color: #ffffff;
}
/*@media all and (min-width:992px)*/
.flexslider .overlay h3 {
    font-size: 1.62em;
    margin-top: 0;
    /*font-family: "Open Sans", "myriad-pro-n3", "myriad-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    font-weight: 300;
    color: #ffffff;
}
/*@media all and (min-width:992px)*/
.flexslider .overlay a {
    color: #ffffff;
}
/*@media all and (min-width:992px)*/
.flexslider .overlay h4 {
    font-size: 1.12em;
    /*font-family: "Open Sans", "myriad-pro-n3", "myriad-pro", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    font-weight: 300;
}

/* --- Home Screen Latest Updates --- */
.latest > h2 {
    padding: 0 0 10px 20px;
    font-size: 1.37em;
    margin-bottom: 5px;
}

.latest > h2 > span {
    font-size: 14px;
    margin-top: 5px;
    display: inline;
/*    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    background: none;
    padding-left: 0;
}

.latest > h2 > span > a {
    margin: 5px 15px;
    float: right;
    border: none;
}

.latest > h2 > span > a > .fa {
    margin-right: 5px;
}

.newsItem {
    display: block;
    clear: both;
    padding: 15px;
    background: #ffffff;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-bottom: 1px solid #cedbe4;
    margin: 0;
}

.newsItem:hover {
    background: #dee7ed;
    text-decoration: none;
    -moz-transform: translateX(5px);
    -webkit-transform: translateX(5px);
    -o-transform: translateX(5px);
    -ms-transform: translateX(5px);
    transform: translateX(5px);
}


.media > .pull-left {
    margin-right: 10px;
}

.media-object {
    display: block;
}

.img-circle {
    border-radius: 50%;
}

.media, .media-body {
    overflow: hidden;
    zoom: 1;
}

.newsItem h4 {
    font-size: 1.3em;
}

.media-heading {
    margin: 0 0 5px;
}

.newsItem .date {
    font-size: 0.9em;
    vertical-align: middle;
    color: #555555;
}

.date, .category {
    margin-right: 15px;
    font-size: 0.9em;
}

.newsItem .category {
    vertical-align: middle;
    color: #555555;
    display: inline-block;
}



/*  Sign in page content
**************************************************************
**************************************************************/

.page-title-sign-in {
    border-bottom: 1px solid #12aaed;
    font-size: 2.0em;
    font-weight: 100;
}
    /* iPhone 6 plus & below */
    @media (max-device-width: 414px){
        .page-title-sign-in {
            font-size: 1.9em;
        }
    }
    /* iPhone 5 & below */
    @media (max-device-width: 320px) {
        .page-title-sign-in {
            margin-top: 10px;
            margin-bottom: 0;
            font-size: 1.7em;
        }
    }

/* username and password fields */
.signin-group {
    padding-left: 0;
}
.signin-group > li {
    padding-top: 20px;
    list-style: none;
}
.signin-group > li input {
    width: 350px;
}
    /* iPhone 6 plus & below */
    @media (max-device-width: 414px){
        .signin-group > li input {
            width: 100%;
        }
    }

.signin-group li a {
    display: inline-block;
    margin-left: 205px;
    font-size: 1.0em;
    color: #0076CC;
}
    /* iPhone 6 plus */
    @media (max-device-width: 414px) {
        .signin-group li a {
            margin-left: 260px;
        }
    }
    /* iPhone 6 */
    @media (max-device-width: 375px) {
        .signin-group li a {
            margin-left: 220px;
        }
    }
    /* iPhone 4 & 5 */
    @media (max-device-width: 320px) {
        .signin-group li a {
            font-size: 0.9em;
            margin-left: 180px;
        }
    }

/* text boxes */
.form-field-text {
    height: 35px;
    border-radius: 4px;
    padding-left: 2px;
    background-color: #FFFFFF;
}

/* Remember me selection*/
#remember-me {
    width: 30px;
    /* Hide element */
    display: none;
}
.signin-group .forcheckbox {
    display: inline;
    /* Hide element */
    display: none;
}
    /* iPhone 4 & 5 */
    @media (max-device-width: 320px) {
        .signin-group .forcheckbox {
            font-size: 0.9em;
        }
    }

/* terms and conditions */ 
.tnc {
    width: 350px;
    padding: 20px 10px 0 10px;
    font-size: 0.9em;
    /* Hidden -- until we have the legal documents available */
    display: none;
}
    /* iPhone 6 plus & below */
    @media (max-device-width: 414px) {
        .tnc {
            width: 100%;
        }
    }
    /* iPhone 4 & 5 */
    @media (max-device-width: 320px) {
        .tnc {
            font-size: 0.8em;
        }
    }

/* Validation, password and username error */
.validation-summary-valid {
    color: #FFF;
    display:none;
}
.validation-summary-errors {
    /*width: 350px;
    padding: 20px 10px 0 10px;*/
    font-size: 0.9em;
    color: #CC1814;
}
    /* Hide bullet from list item */
    .validation-summary-errors ul {
        padding-left: 0;
        list-style: none;
    }

    /* iPhone 6+ & below */
    @media (max-device-width: 320px) {
        .validation-summary-errors {
            width: 100%;
        }
    }
    /* iPhone 4 & 5 */
    @media (max-device-width: 320px) {
        .validation-summary-errors {
            font-size: 0.8em;
        }
    }


/* Don't have an account section */
.no-account {
    margin-top: 0;
    padding-top: 40px;
    font-size: 2.0em;
    font-weight: 100;
}
    /* Shrink text and padding for mobile device */
    /* iPhone 6 plus & below */
    @media (max-device-width: 414px){
        .no-account {
            padding-top: 5px;
            font-size: 1.4em;
        }
    }
    /* iPhone 4 & 5 */
    @media (max-device-width: 320px) {
        .no-account {
            padding-top: 0;
            margin-bottom: 5px;
            font-size: 1.0em;
        }
    }
.create-account-txt {
    font-size: 1.0em;
}
    /* Shrink text for mobile device */
    @media (max-device-width: 320px) {
        .create-account-txt {
            font-size: 0.9em;
        }
    }

/* Blue sign in button */
.btn-signin {
    width: 350px;
    margin-top: 30px;
    margin-bottom: 20px;
    padding: 10px 15px;
    display: block;
}
    /* -- iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .btn-signin {
            width: 100%;
        }
    }
    /* -- iPhone 5 & below -- */
    @media (max-device-width: 414px) {
        .btn-signin {
            margin-top: 20px;
        }
    }

/* Cookies disabled alert message
***********************************/
.cookies-disabled {
    border: 3px solid goldenrod;
    background: antiquewhite;
    padding: 15px;
    /* Hide prior to detectCookies script toggle */
    display:none;
}

/* Cookies disabled - heading text */
.cookies-disabled > h4 {
    color: goldenrod;
}

/* Cookies disabled - link text */
.cookies-disabled > a > p {
    color: #0076CC;
}
.cookies-disabled > a > p:hover {
    color: #004A7F;
}
    /* -- iPad (portrait) -- */
        @media (max-device-width: 768px) {
        .cookies-disabled > h4 {
            margin-bottom: 20px;
            font-size: 1.2em;
        }
        .cookies-disabled > p {
            font-size: 0.9em;
        }
        .cookies-disabled > a > p {
            font-size: 0.9em;
        }
    }
    
    /* -- iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .cookies-disabled {
            position: inherit;
            border: none;
            margin-top: 0;
            padding: 5px 15px 5px 15px;
        }
        .cookies-disabled > h4 {
            margin-bottom: 20px;
            font-size: 1.1em;
        }
        .cookies-disabled > a > p {
        border: 1px solid #0062A9;
        border-radius: 3px;
        padding: 10px;
        margin-bottom: 20px;
        background: #0062A9;
        color: #FFFFFF;
        }
    }



/*  Change password page content
**************************************************************
**************************************************************/

.page-title-change-password {
    border-bottom: 1px solid #12aaed;
    font-size: 2.0em;
    font-weight: 100;
}
.p-change-password {
    margin-top: 20px;
}
.change-password-fields {
    display: block;
    margin-top: 20px;
}
.change-password-group input {
    height: 35px;
    width: 350px;
    border-radius: 4px;
    padding-left: 2px;
    background-color: #FFFFFF;
}
    /* iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .change-password-group input {
            width: 100%;
        }
    }
    
.request-password-group input {
    height: 35px;
    width: 350px;
    border-radius: 4px;
    padding-left: 2px;
    background-color: #FFFFFF;
}
    /* iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .request-password-group input  {
            width: 100%;
        }
    }

/* Request password button */
.btn-requestpassword {
    width: 350px;
    margin-top: 30px;
    margin-bottom: 20px;
    padding: 10px 15px;
    display: block;
}
    /* -- iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .btn-requestpassword {
            width: 100%;
        }
    }
    /* -- iPhone 5 & below -- */
    @media (max-device-width: 414px) {
        .btn-requestpassword {
            margin-top: 20px;
        }
    }



/*  Cookies page content
**************************************************************
**************************************************************/

.cookie-quote {
    border-left: 5px solid #ddd;
    font-size: 1.0em;
}
.cookie-h2 {
    border-bottom: none;
    margin-top: 30px;
    font-size: 1.4em;
}
.cookie-h2:first-of-type {
    margin-top: 10px;
}
.cookie-how {
    border-bottom: 1px solid #12AAED;
    margin-top: 30px;
    font-size: 1.4em;    
}
.cookie-h3 {
    font-size: 1.2em;    
}


/*  Registration page content
**************************************************************
**************************************************************/

.registration-title {
    margin-top: 0;
}

    /* iPhone 6 plus & below -- */
    @media (max-device-width: 414px) {
        .registration-title  {
            font-size: 1.5em;
        }
    }

.registration-helpbox {
    position: absolute;
    margin: 48px 60px 60px 450px;
    padding: 0 15px 15px 15px;
    border: 1px solid #0062a9;
    background: aliceblue;
}

    /* iPad horizontal below -- */
    @media (max-device-width: 768px) {
        .registration-helpbox {
            position: inherit;
            margin: 30px 10px;
        }
    }

.registration-helpbox > h3 {
    font-size: 1.5em;
}

.registration-helpbox > h4 {
    margin-top: 30px;
    font-size: 1.2em;
}

.registration > p:first-of-type {
    margin-top: 30px;
}

.btn-register {
    margin-top: 60px;
}

/* Hide prior to jQuery toggle for mobile */
.registration-helpbox-signin-mobile {
    display: none;
}

.registration-helpbox-signin-desktop {
    display: inline;
}

    /* iPad horizontal below -- */
    @media (max-device-width: 414px) {
        .registration-helpbox-signin-mobile {
            display: inline;
        }
        .registration-helpbox-signin-desktop {
            display: none;}
    }
    
#registration-signin-title {
    display: none;
}

    /* iPad horizontal below -- */
    @media (max-device-width: 768px) {
        #registration-signin-title {
            display: inherit;
            font-size: 1.4em;
        }
    }




/* Force change of Navbar breakpoint */
/* Forces mobile navigation for iPads at 768px and mobile for anything at and under 769px */
@media (max-width: 769px) {
  .navbar-header {
      float: none;
  }
  .navbar-left,.navbar-right {
      float: none !important;
  }
  .navbar-toggle {
      display: block;
  }
  /*.navbar-collapse {
      border-top: 1px solid transparent;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }*/
  .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
  }
  
  .navbar-nav {
      float: none!important;
      margin-top: 7.5px;
  }
  .navbar-nav>li {
      float: none;
  }
  .navbar-nav>li>a {
      padding-top: 10px;
      padding-bottom: 10px;
  }
  .collapse.in{
      display:block !important;
  }
}