.navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md,
.navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
  display: flex;
  flex-wrap: inherit;
  align-items: center;
  justify-content: space-between;
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.visible {
  display: block !important;
}

.height-inherit {
  height: inherit;
}

/* /////////////// FLEX CLASSES \\\\\\\\\\\\\\\ */
.flex-column { 
  flex-direction: column !important;
}

.flex-row { 
  flex-direction: row !important;
}

.flex {
  display: flex;
}

.flex-10 {
  flex: 1 1;
}

.flex-09 {
  flex: 0.9 0.9;
}

.flex-08 {
  flex: 0.8 0.8;
}

.flex-07 {
  flex: 0.7 0.7;
}

.flex-06 {
  flex: 0.6 0.6;
}

.flex-05 {
  flex: 0.5 0.5;
}

.flex-04 {
  flex: 0.4 0.4;
}

.flex-03 {
  flex: 0.3 0.3;
}

.flex-02 {
  flex: 0.2 0.2;
}

.flex-01 {
  flex: 0.1 0.1;
}

.items-center {
  align-items: center;
}

.justify-start {
  justify-content: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-end {
  justify-content: flex-end;
}

.justify-space-between {
  justify-content: space-between;
}

/* /////////////// FLEX CLASSES \\\\\\\\\\\\\\\ */
.px-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}

.px-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

/* ////////////////// DISPLAY \\\\\\\\\\\\\\\\\\ */
.sm-invisible
{
    display: none;
}

.flex {
  flex-direction: column;
}

.basis-auto {
  flex-basis: auto;
}

@media (min-width:320px)  {
  /* smartphones, iPhone, portrait 480x320 phones */
}
@media (min-width:481px)  {
  /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
}
@media (min-width:641px)  {
  /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
  .sm-invisible
  {
      display: inherit;
  }
  .flex {
    flex-direction: row;
  }
}
@media (min-width:961px)  {
/* tablet, landscape iPad, lo-res laptops ands desktops */
}
@media (min-width:1025px) {
/* big landscape tablets, laptops, and desktops */
}
@media (min-width:1281px) {
/* hi-res laptops and desktops */
}