:root {
    --main-background-colour: rgb(250, 250, 200);
    --main-colour: rgb(50, 50, 5);
    --main-intense-colour: rgb(252, 112, 37);
    --sm-padding: 2px;
    --md-padding: 5px;
    --lg-padding: 8px;
    --xl-padding: 18px;
}

body {
   background-color: var(--main-background-colour);
   color: var(--main-colour); 
   font-family:  "Helvetica Neue", Helvetica, Arial, sans-serif;
   font-size: 16px;
   line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    color: var(--main-intense-colour);
    margin-bottom:0;
}

table.table-bordered,
table.table-bordered th,
table.table-bordered td {
    border-width: 1px;
    border-style: solid;
    border-color: var(--main--colour);
    border-collapse: collapse;
}

/* table.rounded-borders th,
table.rounded-borders td {
    border-color: var(--main-colour);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-collapse: collapse;
} */
.container {
    display: flex;
    width: 100%
}
.container-center {
    display: flex;
    justify-content: center;
    width: 100%
}
.container-end {
    display: flex;
    width: 100%;
    justify-content: end;
}
.container-between {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.v-container {
    display: flex;
    height: 100;
    flex-direction: column;
}

.v-container-center {
    display: flex;
    height: 100;
    flex-direction: column;
    justify-content: center;
}

table.rounded-borders {
    border-radius: 10px;
    border-color: var(--main-colour);
    border-width: 3px;
    border-style: solid;
}

table.padded-content,
table.padded-content th,
table.padded-content td {
    padding: var(--sm-padding);
}

table.md-padded-inner-content {
    padding: var(--md-padding);
}

.mw-50 {
    min-width: 50%;
}

.w-50 {
    width:50%;
}

.w-100 {
    width: 100%
}

.sm-padding {
    padding: var(--sm-padding)
}

.sm-margin {
    margin: var(--sm-margin)
}

.md-padding {
    padding: var(--md-padding)
}

.md-margin {
    margin: var(--md-padding)
}

.lg-padding {
    padding: var(--lg-padding)
}

.lg-margin {
    margin: var(--lg-padding)
}

.lg-margin-top {
    margin-top: var(--lg-padding)
}

.xl-margin-top {
    margin-top: var(--xl-padding);
}

.lg-padding-x {
    padding-left: var(--lg-padding);
    padding-right: var(--lg-padding);
}

hr {
    border: 1px solid var(--main-intense-colour);
    opacity: 0.7;
    margin-top: 0;
    margin-bottom: 0;
}

.intense-bar-container {
    height: 2px; 
    background: var(--main-intense-colour);
    position:relative;
    padding: 0;
    margin: 0;
}

.intense-bar-indicator {
    height: 100%;
    -webkit-mask:linear-gradient(#fff 0 0);
    mask:linear-gradient(#fff 0 0);
}

.intense-bar-indicator::before {
    content:"";
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-image: linear-gradient(90deg, rgba(100, 179, 45, 0), var(--main-background-colour));
}

.fade-in {
	opacity: 1;
	animation-name: fadeInOpacity;
	animation-iteration-count: 1;
	animation-timing-function: ease-in;
	animation-duration: 0.5s;
}

.text-end {
    text-align: end;
}

.dim {
    opacity: 0.75;
}

.small-text {
    font-size: 14px;
}

.mb-0 {
    margin-bottom: 0
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
        margin-top: 20px;
    }
	100% {
		opacity: 1;
        margin-top: 0px;
	}
}