/* ---- Colour Variables ---- */
:root {

    --origin-font: "Manrope", "Segoe UI", sans-serif;

    --origin-white: #ffffff;
    --origin-white-rgb: 255, 255, 255;

    --origin-main-01: #66fefc;
    --origin-main-01-rgb: 102, 254, 252;
    --origin-main-02: #52e6d3;
    --origin-main-02-rgb: 82, 230, 211;
    --origin-main-03: #00a99a;
    --origin-main-03-rgb: 0, 169, 154;
    --origin-main-04: #006768;
    --origin-main-04-rgb: 0, 103, 104;

    --origin-secondary-01: #dbe1ea;
    --origin-secondary-01-rgb: 219, 225, 234;
    --origin-secondary-02: #9ca9b8;
    --origin-secondary-02-rgb: 156, 169, 184;
    --origin-secondary-03: #013234;
    --origin-secondary-03-rgb: 1, 50, 52;

    --origin-dark: #000909; 
    --origin-dark-rgb: 0, 9, 9;
}

/* ---- Reset Bootstrap ---- */

:root {
    --bs-body-font-family: var(--origin-font);
    --bs-body-color: var(--origin-secondary-03); 
    --bs-body-color-rgb: var(--origin-secondary-03-rgb);
    --bs-dark: var(--origin-dark);
    --bs-dark-rgb: var(--origin-dark-rgb);
    --bs-light: var(--origin-secondary-01);
    --bs-light-rgb: var(--origin-secondary-01-rgb);
    --bs-primary:     var(--origin-main-03);
    --bs-primary-rgb: var(--origin-main-03-rgb);
    --bs-body-font-size: 0.875rem;
}

/* ---- Headers ---- */

h1, h2 {
    font-weight: bold;
}

h1 {
    font-size: 2.125rem; /* 34px fixed on large screens */
}

h2 {
    font-size: 1.25rem; /* 20px fixed on large screens */
}

.fs-3 {
    font-size: 1.875rem !important; /* 30px fixed on large screens */
 }

.fs-4 {
    font-size: 1.5265rem !important; /* 24.42px fixed on large screens */
}

.fs-5 {
    font-size: 1.25rem !important; /* 20px fixed on large screens */
}

.fs-5b {
    font-size: 1.125rem !important; /* 18px fixed on large screens */
}

.fs-6 {
    font-size: 1rem !important; /* 16px fixed on large screens */
}

.fs-7 {
    font-size: 0.9375rem !important; /* 15px fixed on large screens */
}



/* ---- Borders ---- */


.rounded-number {
    width: 1.5rem; 
    height: 1.5rem; 
    line-height: 1.5rem;
}

.rounded-number-lg {
    width: 2rem; 
    height: 2rem; 
    line-height: 2rem;
}

.border-md-start {
  border-left: 0 !important;
}

@media (min-width: 768px) {
    .border-md-start {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
}

.border-top-sm-only {
    border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

@media (min-width: 768px) {
    .border-top-sm-only {
        border-top: 0 !important;
    }
}

.border-2 {
    border-width: 2px !important;
}


.border-light {
    border-color: var(--origin-secondary-02) !important;
}

.border-lighter {
    border-color: var(--origin-secondary-01) !important;
}

.border-primary {
    border-color: var(--origin-main-03) !important;
}

.border-secondary {
    border-color: var(--origin-main-02) !important;
}

.border-tertiary {
    border-color: var(--origin-main-04) !important;
}


/* ---- Links ---- */


a.link-light {
    --bs-link-color: var(--origin-white);
    --bs-link-color-rgb: var(--origin-white-rgb);
    --bs-link-hover-color: var(--origin-main-04);
    --bs-link-hover-color-rgb: var(--origin-main-04-rgb);
}

a.link-light,
a.link-light:hover,
a.link-light:focus {
  text-decoration: none;
}

/* ---- Text ---- */

.text-muted {
    color: var(--origin-secondary-02) !important;
}

.text-main-02 {
    color: var(--origin-main-02) !important;
}


.text-tertiary {
    color: var(--origin-main-04) !important;
}

/* ---- Backgrounds ---- */

.bg-tertiary {
    background-color: var(--origin-main-04) !important;
}

.bg-darker {
    background-color: #d6dfe1 !important ;
}

/* ---- Buttons ---- */

.btn {
    font-weight: bold;
}

.btn .fas {
    font-size: 2em;
    vertical-align: middle;
}

.btn-sm {
    --bs-btn-font-size: 0.8125rem;
}

.btn-primary {
    --bs-btn-bg: var(--origin-main-02);
    --bs-btn-border-color: var(--origin-main-02);

    --bs-btn-hover-bg: var(--origin-main-03);
    --bs-btn-hover-border-color: var(--origin-main-03);

    --bs-btn-active-bg: var(--origin-main-04);
    --bs-btn-active-border-color: var(--origin-main-04);

    --bs-btn-color: var(--origin-dark);
    --bs-btn-hover-color: var(--origin-white);
    --bs-btn-active-color: var(--origin-white);
}

.btn-plus {
    background-color: var(--origin-dark);
    color: var(--origin-main-04);
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    line-height: 2rem;
    padding: 0;
}

.btn-plus:hover,
.btn-plus:focus {    
    background-color: var(--origin-white);
    color: var(--origin-main-04);
}


.btn-close {
    --bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2352e6d3'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293A1 1 0 0 1 .293 14.293L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");
    --bs-btn-close-opacity: 1;
    --bs-btn-close-hover-opacity: 1;
  
    background-color: var(--origin-dark);
    filter: none;
}

.btn-rounded{
    background-color: var(--origin-main-04);
    color: var(--origin-main-03);
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    line-height: 2rem;
    padding: 0;
    font-weight: normal;
    font-size: 0.4rem !important;
    text-align: center;
}

.btn-rounded i {
    font-size: 1rem;
    vertical-align: middle;
}

.btn-rounded img {
    width: 1.5rem;
    height: 1.5rem;
    vertical-align: middle;
}

.btn-rounded:hover {    
    background-color: var(--origin-white);
    color: var(--origin-main-04);
}

.btn-rounded-white {
    background-color: var(--origin-white);
    color: var(--origin-dark);
}

.btn-rounded-white:hover {
    background-color: var(--origin-main-03);
    color: var(--origin-white);
}

/* ---- Positions ---- */

.top-5 {
    top: 0.5rem !important;
}

.start-5 {
    left: 0.5rem !important;
}

.end-5 {
    right: 0.5rem !important;
}

/* ---- Lists ----- */

.list-bordered {
    padding-left: 0;
    list-style: none;
}

.list-bordered > li {
    border-bottom: 1px solid var(--origin-main-03);
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.list-bordered.list-border-white  {
    border-top: 1px solid var(--origin-white) !important;
}

.list-bordered.list-border-white > li {
    border-bottom: 1px solid var(--origin-white) !important;
}

.list-bordered.list-border-white a {
    color: var(--origin-white) !important;
    text-decoration: none;
}

.list-bordered.list-border-white a i {
    color: var(--origin-dark) !important;
}

.list-bordered.list-border-white a:hover,
.list-bordered.list-border-white a:focus {
    color: var(--origin-main-04) !important;
    text-decoration: none;
}

.bg-tertiary .list-bordered.list-border-white a:hover,
.bg-tertiary .list-bordered.list-border-white a:focus {
    color: var(--origin-main-02) !important;
}

.bg-dark .list-bordered.list-border-white a:hover,
.bg-dark .list-bordered.list-border-white a:focus {
    color: var(--origin-main-02) !important;
}

.bg-dark .list-bordered.list-border-white a i {
    color: var(--origin-main-04) !important;
}


/* ---- Header ---- */

.header {
    --bs-primary:     var(--origin-main-02);
    --bs-primary-rgb: var(--origin-main-02-rgb);

     background-image: url('/images/background-header.jpg');
     background-position: center center;
     background-size: cover;
}

/* ---- Navigation ---- */

.navbar-toggler {
    background-color: var(--origin-main-02);
    color: var(--origin-dark);
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23000909' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


@media (max-width:767.98px) {
    .navbar-collapse {
        background-color: var(--origin-main-02);
        padding: 1rem;
    }

    .navbar-collapse .navbar-nav:first-child{
        background-color: transparent;
    }

    .navbar-nav .nav-link {
        color: var(--origin-dark);
        border-bottom: 1px solid var(--origin-dark);
        padding: 0.25rem 0 !important;
        font-size: 1.25rem;
    }

    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link.show
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus
    {
        color: var(--origin-dark);
        font-weight: bold;
        border-bottom: 1px solid var(--origin-main-04);
    }
}

@media (min-width:768px) {

    .navbar-collapse .navbar-nav:nth-child(2) {
        background-color: var(--origin-dark);
    }

    .navbar-collapse .navbar-nav:last-child .nav-link {
        
        border: 1px solid var(--origin-white);
    }

    .navbar-collapse .navbar-nav:last-child .nav-link.active,
    .navbar-collapse .navbar-nav:last-child .nav-link:hover,
    .navbar-collapse .navbar-nav:last-child .nav-link:focus {
        
        border: 1px solid var(--origin-main-02);
    }

     .navbar-collapse .navbar-nav:last-child {
        margin-left: 1rem;
     }

    .navbar-nav {
        padding: 2px;
        border-radius: var(--bs-border-radius-pill) !important;
    }

    .navbar-nav .nav-link {
        padding: 1px 1rem !important;
        color: var(--origin-white);
        border-radius: var(--bs-border-radius-pill) !important;
        font-size: 0.8125rem;
        
    }

    .navbar-nav .nav-item {
        margin-left: 0.25rem;
    }

    .navbar-nav .nav-item:first-child {
        margin-left: 0;
    }

    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link:hover,
    .navbar-nav .nav-link:focus {
        background-color: var(--origin-main-02);
        color: var(--origin-dark);
    }

    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link.active:hover,
    .navbar-nav .nav-link.active:focus {
        background-color: var(--origin-main-02);
        color: var(--origin-dark);
    }
}


/* ---- Footer ---- */

.footer {
    --bs-link-color: var(--origin-white);
    --bs-link-color-rgb: var(--origin-white-rgb);
    --bs-link-hover-color: var(--origin-main-04);
    --bs-link-hover-color-rgb: var(--origin-main-04-rgb);

    --bs-primary:     var(--origin-main-02);
    --bs-primary-rgb: var(--origin-main-02-rgb);

    --bs-secondary:    var(--origin-main-01);
    --bs-secondary-rgb: var(--origin-main-01-rgb);
    
     font-size: 0.75rem; 

     background-image: url('/images/background-footer.jpg');
     background-position: center center;
     background-size: cover;
}


.footer a,
.footer a:hover,
.footer a:focus {
  text-decoration: none;
}

.footer .nav-social {
    --bs-link-color: var(--origin-main-01);
    --bs-link-color-rgb: var(--origin-main-01-rgb);
    --bs-link-hover-color: var(--origin-main-04);
    --bs-link-hover-color-rgb: var(--origin-main-04-rgb);
}

.footer .nav-link {
    text-decoration: underline;
    text-decoration-color: var(--origin-main-02);
    text-underline-offset: 2px;
}

/* ---- Investor Table ---- */

.table-investor {
    --bs-border-color: var(--origin-main-03);
     
}


 
.table-investor td,
.table-investor th {
    padding: 0.25rem 0rem 0.25rem 0.25rem;
     
}

 .table-investor tbody td,
 .table-investor tbody th {
    
    font-weight: bold;
    color: var(--origin-secondary-02) !important;
 }


 .table-investor td span {
    font-weight: bold;
    color: var(--origin-secondary-02) !important;
 }

 .table-investor tr td:first-child {
    color: var(--origin-dark) !important;
 }

 .table-investor a {
    color: var(--origin-dark) !important;
    text-decoration: none;
    font-weight: bold;
 }

 .table-investor a:hover,
 .table-investor a:focus {
    color: var(--origin-main-02) !important;
    text-decoration: none;
 }

 .table-investor-downloads tr td:last-child {
    text-align: right;
 }

  .table-investor-downloads tr td:last-child a {
    color: var(--origin-main-02) !important;
    text-decoration: none;
 }

 .table-investor-downloads tr td:last-child a:hover,
 .table-investor-downloads tr td:last-child a:focus {
    color: var(--origin-dark) !important;
    text-decoration: none;
 }


 /* ---- Investor Nav ---- */




    .nav-investor {
        background-color: var(--origin-dark);
        padding: 2px;
        border-radius: var(--bs-border-radius-xl) !important;
        
    }

    @media (min-width:768px) {
        .nav-investor {
            border-radius: var(--bs-border-radius-pill) !important;
        }
}

    .nav-investor .nav-link {
        padding: 4px 1rem !important;
        color: var(--origin-secondary-02);
        border-radius: var(--bs-border-radius-pill) !important;
        font-size: 0.8125rem;
        font-weight: bold;;
        
    }

    .nav-investor .nav-item {
        margin-left: 0.5rem;
    }

    .nav-investor .nav-item:first-child {
        margin-left: 0;
    }

    .nav-investor .nav-link.active,
    .nav-investor .nav-link:hover,
    .nav-investor .nav-link:focus {
        background-color: var(--origin-main-02);
        color: var(--origin-dark);
    }

    .nav-investor .nav-link.active,
    .nav-investor .nav-link.active:hover,
    .nav-investor .nav-link.active:focus {
        background-color: var(--origin-main-02);
        color: var(--origin-dark);
    }