/* CSS Style Sheet for mrgb/template-pages */

html {
    /*position: relative; /* bug fix to make min-height 100% work */
    min-height: 100vh;
    width: 100%;
}

/* overflow: hidden would be to stop overscolling */
.mb-body {
    /* overflow: hidden; */
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0px;
    padding: 0px;
}

/* ********** */
.mb-standard-header {
    /*height: 15%;*/
    width: 100%;
}

.mb-standard-footer {
    /*height: 10%;*/
    width: 100%;
}

.mb-standard-section {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    width: 100%;
    /*overflow-y: auto;
    overflow-x: hidden;*/
}

.mb-standard-container {
    flex-grow: 1;
    width: 100%;
}

/* ********** */
.mb-vertical-scroll {
    overflow-y: auto;
    overflow-x: hidden;
}

/* ********** */
.mb-full-height {
    height: 100%;
}

.mb-height-90 {
    height: 90%;
}

.mb-full-width {
    width: 100%;
}

.mb-width-90 {
    width: 90%;
}

/* ********** */
.mb-title {
    vertical-align: middle;
    text-align: center;
}

.mb-banner-image {
    max-height: 10.0rem;
    /*max-height: 100%;*/
}

.mb-banner-image-off {
    display: none !important;
}

.mb-restore-flex-shrink {
    flex-shrink: 1 !important;
}


@media only screen 
and (min-device-width : 450px)
and (max-device-width : 768px) {
  .mb-banner-image-header-450 {
    display: inline-block !important;
  }
  .mb-banner-image-footer-450 {
    display: inline-block !important;
  }
}

@media only screen 
and (min-device-width : 769px) 
and (max-device-width : 1023px) {
  .mb-banner-image-header-769 {
    display: inline-block !important;
  }
  .mb-banner-image-footer-769 {
    display: inline-block !important;
  }
}

@media only screen 
and (min-device-width : 1024px) {
  .mb-banner-image-header-1024 {
    display: inline-block !important;
  }
  .mb-banner-image-footer-1024 {
    display: inline-block !important;
  }
}

.mb-header-logo {
    margin-left: 0.0rem;
    margin-right: 1.0rem;
    margin-top: 0.0rem;
    margin-bottom: 0.0rem;
    vertical-align: middle;
    max-height: 3.0rem;
    max-width: 10.0rem;
}

.mb-footer-logo {
    max-height: 3.0rem;
    max-width: 10.0rem;
}

/* ********** */
/* Used to fix a bug in Bulma */
.mb-no-side-padding {
    padding-left: 0rem;
    padding-right: 0rem;
}

.mb-force-no-side-padding {
    padding-left: 0rem !important;
    padding-right: 0rem !important;
}

/* ********** */
.mb-force-top-margin-zero {
    margin-top: 0rem !important;
}

.mb-top-margin-small {
    margin-top: 0.5rem;
}

.mb-force-top-margin-small {
    margin-top: 0.5rem !important;
}

.mb-top-margin {
    margin-top: 1.0rem;
}

.mb-force-top-margin {
    margin-top: 1.0rem !important;
}

.mb-top-margin-big {
    margin-top: 2.0rem;
}

.mb-force-top-margin-big {
    margin-top: 2.0rem !important;
}

/* ********** */
.mb-force-bottom-margin-zero {
    margin-top: 0rem !important;
}

.mb-force-bottom-margin-4px {
    margin-bottom: 4px !important;
}

.mb-bottom-margin-small {
    margin-bottom: 0.5rem;
}

.mb-force-bottom-margin-small {
    margin-bottom: 0.5rem !important;
}

.mb-bottom-margin {
    margin-bottom: 1.0rem;
}

.mb-force-bottom-margin {
    margin-bottom: 1.0rem !important;
}

.mb-bottom-margin-big {
    margin-bottom: 2.0rem;
}

.mb-force-bottom-margin-big {
    margin-bottom: 2.0rem !important;
}

/* ********** */
.mb-left-margin-small {
    margin-left: 0.5rem;
}

.mb-force-left-margin-small {
    margin-left: 0.5rem !important;
}

.mb-left-margin {
    margin-left: 1.0rem;
}

.mb-force-left-margin {
    margin-left: 1.0rem !important;
}

.mb-left-margin-big {
    margin-left: 2.0rem;
}

.mb-force-left-margin-big {
    margin-left: 2.0rem !important;
}

/* ********** */
.mb-right-margin-small {
    margin-right: 0.5rem;
}

.mb-force-right-margin-small {
    margin-right: 0.5rem !important;
}

.mb-right-margin {
    margin-right: 1.0rem;
}

.mb-force-right-margin {
    margin-right: 1.0rem !important;
}

.mb-right-margin-big {
    margin-right: 2.0rem;
}

.mb-force-right-margin-big {
    margin-right: 2.0rem !important;
}

/* ********** */
.mb-round-border {
    border-radius: 15px;
}

.mb-hover-grey:hover {
    background-color: #e0e0e0;
}

/* Works well with Bulma */
.mb-hover-shadow:hover {
    box-shadow: inset 0 1px 2px rgba(10,10,10,0.2), 0 0 0 1px #a0b0dc;
}

.mb-hover-shadow-dark:hover {
    box-shadow: inset 0 1px 2px rgba(10,10,10,0.2), 0 0 0 1px #3273dc;
}

/* ********** */
.mb-red {
    color: red;
}

.mb-border {
    border-style: solid;
    border-width: 1px;
}

/* ********** */