/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

:root {
    --brand-primary-dark: #202431;
    --brand-primary-light: #d3d9d9;
    --brand-highlight-1: #e43512;
    --brand-highlight-2: #3b6a6c;
    --brand-highlight-3: #e43512;
    --brand-font-heading: var(--brand-primary-dark);
    --brand-font-body: #263143;
    --brand-btn-primary: #e43512;
    --brand-btn-primary-hover: #e43512ee;
    --white: #ffffff;
    --brand-btn-remittance: #202431;
    --brand-btn-remittance-hover: #202431ee;
}


/* https://stackoverflow.com/questions/10410851/make-drag-and-drop-file-upload-div-to-work-like-an-input-type-file
/* https://jsfiddle.net/artipixel/zkrfcbLd/
/* Drag and Drop File Dilaog */
.blue-text {
    color: #8e97a0;
}

.underline {
    text-decoration: underline;
}

.drop-field {
    position: relative;
    text-align: center;
    vertical-align: middle;
}

.drop-field,
.drop-area {
    min-height: 150px;
    min-width: 300px;
}

    .drop-field .browse {
        z-index: 0;
        position: absolute;
        left: 0;
        bottom: 0;
        right: 0;
        margin: 0 auto;
    }

    .drop-field .drop-area {
        display: block;
        border: 1px dashed #CED4DA;
        position: relative;
    }

    .drop-field,
    .drop-area,
    .drop-field .browse {
        transition: all 0.3s;
    }

        .drop-field.loaded .drop-area {
            border: 1px solid #CED4DA;
        }

        .drop-field .browse {
            opacity: 0;
            transform: translateY(100%);
        }

        .drop-field.loaded .browse {
            opacity: 1;
            transform: translateY(0);
        }

        .drop-field.hover .drop-area {
            border: 1px solid black;
        }

        .drop-field .drop-area input[type="file"] {
            height: 100%;
            width: 100%;
            position: absolute;
            display: block;
            z-index: 3;
            top: 0;
            left: 0;
            opacity: 0.000001;
        }

        .drop-field .file-list {
            position: absolute;
            z-index: 0;
            top: 0;
            left: 0;
            text-align: center;
        }

        .drop-field .remove {
            position: absolute;
            left: 20px;
            top: 20px;
            z-index: 4;
            transition: all 0.3s;
            opacity: 0;
            transform: translateY(-100%);
            cursor: pointer;
        }

            .drop-field .remove:hover {
                color: blue;
            }

        .drop-field.loaded .remove {
            opacity: 1;
            transform: translateY(0);
        }

        .drop-field ul li {
            padding: 0;
            text-align: center;
            list-style: none;
        }
/* End of Drag and Drop File Dilaog */


a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.dark {
    background-color: #202431;
    color: #8e97a0;
}

.dark .container > a,
a.nav-link {
  color: var(--brand-primary-light);
}

.dark .container > a:hover, a:active,
a.nav-link:hover, a.nav-link:active
{
  color: var(--brand-highlight-3);
}

body {
    font-family: Montserrat;
    font-weight: 300;
    color: var(--brand-font-body);
}


.dropdown-item:active {
  background-color: var(--brand-btn-primary);
}

h1,h2 {
  /* font-family: playfair display, serif; */
  font-weight: 300;
  color: var(--brand-font-heading);
}

.footer-copy {
  font-size: 0.75rem;
  white-space: normal;
}

.form-container {
  max-width: 40rem;
}

.bg-alert {
  box-shadow: 0 0 3px var(--brand-highlight-3);
}
.form-control {
  border-radius: 0%;
}

.custom-file-label {
  border-radius: 0rem;
  text-transform: none;
}

.custom-file-input {
  border-radius: 0%
}

input[type="checkbox"] {
  box-shadow: 0 1px 7px var(--brand-highlight-3);
}
.alert{
  border-radius: 0%
}

.alert-warning-heading {
  color: var(--brand-font-heading);
  font-weight: 700
}

.alert-warning-body {
  color: var(--brand-highlight-2);
}

.alert-info {
  background-color: var(--brand-primary-light);
  border-color: var(--brand-primary-dark);
  color: var(--brand-primary-dark);
}

.bn-btn-primary {
  background-color:var(--brand-btn-primary);
  border-color: var(--brand-btn-primary);
  border-radius: 0%
}

.bn-btn-primary:hover {
    background-color: var(--white);
    color: var(--brand-btn-primary);
    border-color: var(--brand-btn-primary);
}

.bn-btn-primary:focus {
    box-shadow: 0 0 0 0.2rem var(--brand-btn-primary);
}

.bn-btn-primary:active {
    background-color: var(--white);
    border-color: var(--brand-btn-primary);
}

.bn-btn-remittance {
    background-color: var(--brand-btn-remittance);
    border-color: var(--brand-btn-remittance);
    color: var(--white);
    border-radius: 0%
}

.bn-btn-remittance:hover {
    background-color: var(--brand-btn-remittance-hover);
    color: var(--white);
    border-color: var(--brand-btn-remittance);
}

.bn-btn-remittance:focus {
    box-shadow: 0 0 0 0.2rem var(--brand-btn-remittance);
}

.bn-btn-remittance:active {
    background-color: var(--white);
    border-color: var(--brand-btn-remittance);
}


.select {
    border-radius: 0%
}

.btn {
  border-radius: 0%
}
.bn-btn-secondary {
  color: #686e71;
  background-color: #ffffff;
  border-color: #686e71;
  border-radius: 0%
}

.bn-btn-secondary:hover {
  color: #686e71;
  background-color: #4eada622;
}

.btn-wrap {
  white-space: normal !important;
}

.nav-item .bn-btn-secondary:hover, .card-dark .bn-btn-secondary:hover {
  color: #ffffff;
  background-color: var(--brand-highlight-1);
  border-color: #46748a;
}

.bg-form-group {
  box-shadow: 0 0 3px var(--brand-highlight-3);
  padding: 0.5rem;
  margin-bottom: 0.5rem;
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

.company-button {
    width: 160px;
}


/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  /* Margin bottom by footer height */
  margin-bottom: 120px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  /* Set the fixed height of the footer here */
  /*height: 60px;
  line-height: 60px; /* Vertically center the text there */
}

.downloadBtn {
  border: none; 
  cursor: pointer; 
  background-color: var(--white);
}

select, option {
    font: -moz-pull-down-menu;
    font-family: Montserrat, Arial, Helvetica, sans-serif;
}