/*******************************************************
 * Custom theme code styles
 *******************************************************/
 /*** My custom stuff - START ***/

  .logo_light {
      opacity: .5;
  }

  .footer-images {
    margin: auto;
    display: block;
    position: absolute;
    bottom: 0;
  }

 .logo_sizing_full{
    display:block;
   }
  
  .logo_sizing_mobile{
   display:none;
  }

  .vision-image {  
    border-style: solid;
    border-width: 1px;
    border-color: black;
  }

  @media (max-width: 640px) and (min-width: 320px){
   .logo_sizing_full{
    display:none;
   }
  
   .logo_sizing_mobile{
    display:block;
   }
  }
  
  /*** My custom stuff - END ***/
  /*
   * --------------------------------------------------
   * 1. General Elements
   *--------------------------------------------------
   */
  
  #header {
    /* 1. Header wrapper */
  }
  
  #highlighted {
    /* 2. Highlighted (below header) wrapper */
  }
  
  #content {
    /* 3. Content wrapper */
  }
  
  #content-below {
    /* 4. Content Below wrapper */
  }
  
  #footer {
    /* 5. Footer wrapper */
  }
  
  .styledLine { 
	border-style: solid;
    border-width: 0px 0px 1px 0px;
    border-color: crimson;
} 

  .iconFooterPad {
    padding: 5px 0px 0px 0px;
  }
  
  /*#content-desktop {display: block;}
  #content-mobile {display: none;}*/

  .specialWidth {
    top: 0;
    left: 0;
    position: relative;
    z-index: 1;
    width: 300px;
  }
  
  @media screen and (max-width: 576px) {
  
  .specialWidth {
    width: 150px;
  }
  
  /*#content-desktop {display: none;}
  #content-mobile {display: block;}*/
  
  .specialHide { /*hide - red*/
    display: none;
  }
  .specialShow {
    display: block;
  }
  
  }
  
  @media screen and (min-width: 768px) {
    .vision-image { 
      margin-top: 35px;
  }
  }

  /*
   * --------------------------------------------------
   * 2. Colours
   *-------------------------------------------------- 
  
  
  
   this is to prevent iOS from making links out of phone numbers or other strings of numbers *ALSO see meta tag in main index file.
   .element { pointer-events: none; }
   */
   .element > a { text-decoration:none; color:inherit; }
   
  /*
   * --------------------------------------------------
   * 3. Responsiveness/media queries
   *--------------------------------------------------
   */
  
  
  /* Extra small devices (phones, less than 768px) */
  
  /* No media query since this is the default in Bootstrap */
  
  @media (min-width: 576px) {
    /* Small devices (576px and up). Mixin: media-breakpoint-up(sm) */

  }
  
  @media (min-width: 768px) {
    /* Medium devices (768px and up). Mixin: media-breakpoint-up(md) */
 
  }
  
  @media (min-width: 992px) {
    /* Large devices (992px and up). Mixin: media-breakpoint-up(lg) */

  }
  
  @media (min-width: 1200px) {
    /* X-Large devices (1200px and up). Mixin: media-breakpoint-up(xl) */

  }
  
  /* max-width */
  
  @media (max-width: 575.98px) {
    /* Small devices (575px and down). Mixin: media-breakpoint-down(xs) */
  
  }
  
  @media (max-width: 767.98px) {
    /* Medium devices (767px and down). Mixin: media-breakpoint-down(sm) */
  
  }
  
  @media (max-width: 991.98px) {
    /* Large devices (992px and down). Mixin: media-breakpoint-down(md) */
  }
  
  @media (max-width: 1199.98px) {
    /* X-Large devices (1200px and down). Mixin: media-breakpoint-down(lg) */
  }
  
  /* target one breakpoint */
  
  @media (min-width: 576px) and (max-width: 767.98px) {
    /* Small devices (between 576px and 767px). Mixin: media-breakpoint-only(sm) */

  }
  
  @media (min-width: 768px) and (max-width: 991.98px) {
    /* Medium devices (tablets, between 768px and 991px). Mixin: media-breakpoint-only(md) */

  }
  
  @media (min-width: 992px) and (max-width: 1199.98px) {
    /* Large devices (desktops, between 992px and 1199px). Mixin: media-breakpoint-only(lg) */
  }
  
  @media (min-width: 1200px) {
    /* Extra large devices (large desktops, 1200px and up). Mixin: media-breakpoint-only(xl) */
  }
  
  /* span multiple screenwidths */
  
  @media (min-width: 768px) {
    /* From medium to large (between 768px and 1199px). Mixin: media-breakpoint-between(md, xl)  */
  }
  
  /*
   * --------------------------------------------------
   * 4. Misc
   * Other stuff
   *--------------------------------------------------
   */