/*
    CUSTOM NON-PRIMA

*/

.poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
}

.poppins-medium {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: normal;
}

.poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
}

.poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
}

.poppins-black {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: normal;
}


.debug {
    opacity: 0.1;
}

.modal-title {
    color: var(--col-text-black);
}

.result-modal-text {
    color: var(--col-text-black);
    font-weight: 200;
}

.form-label & not["fs-*"] {
    min-width:210px;

}

.form-text {
    color: var(--col-text-white);
}

.result-view-selected-portal-form {
    padding-top: 4px;
    padding-bottom: 2px;
}

.result-view-custom-form {
    padding-top: 4px;
    padding-bottom: 2px;
}

.result-view-raw-html {
    border-style:solid;
    border-width:2px;
    border-color:var(--col-export-border);
    padding:8px;

}

.portalform-list {
    background-color: var(--col-bg-white);
    border-radius: 4px;
    border-style: solid;
    border-width: 4px;
    padding: 10px;
    max-height: 512px;
    overflow-y: scroll;
}

.custom-form-list {
    display: grid;
    grid-template-columns: auto auto;
    background-color: var(--col-bg-white);
    border-radius: 4px;
    border-style: solid;
    .custom-form-view
{
    background-color: transparent;
    padding: 8px;
}

.dropdown-toggle {
    
    width: 100%;
    border-style: solid;
    border-width: 4px;
    border-color:var(--col-border-black);
    font-weight: bolder;
    align-content: flex-start;
    font-size: x-large;
    background-color: var(--col-bg-orange1);
    text-shadow: 1px 1px var(--col-text-shadow);
    color: var(--col-text-black);
}

.dropdown {

    .dropdown-menu
{
    width: 100%;
    background-color: var(--col-bg-gray2);
    padding: 16px;
    min-height: 530px;
}
    }
}

.custom-form-view {
    background-color: var(--col-bg-gray);
    border-radius: 4px;
    border-style: solid;
    border-width: 4px;
}

.custom-form-view-error {
    color: var(--col-text-red);
    font-weight:bold;
}

#AddCustomFormButton{
    margin-top:16px;
}

.custom-form-view-header {
}

    .custom-form-view-body {

    }

    .upload-area {
        display: flex;
        flex-grow: inherit;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        border: 2px dashed var(--col-border-upload);
        background-color: var(--col-bg-upload);
        cursor: pointer;
        max-width: max(100%, 400px);
        min-height: 50px;
        margin-left: 8px;
        position: relative;
    }

.upload-input::file-selector-button {
    color: var(--col-button-main);
    visibility: hidden;
}

.upload-input {
    font-size: x-large;
    align-content: center;
    input

{
}

}

.upload-area:hover {
    border-color: var(--col-border-upload-hover);
    background-color: var(--col-bg-upload-hover);
}

.upload-area input[type=file] {
    position: absolute;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.upload-area-enter {
    border-color: var(--col-border-upload-enter);
    background-color: var(--col-bg-upload-enter);
}

.portalform {
    background-color: var(--col-bg-orange1) !important;
    padding: 0px;
    border-color: black;
    border-width: 2px;
    border-style: solid;
    max-width: min(28%, 300px) !important;
    margin-left: min(2.5%, 12px) !important;
    margin-right: min(2.5%, 12px) !important;
    margin-bottom: 20px !important;
    .internal

    {
        h4
{
    color: var(--col-text-black);
    margin-bottom: 0px;
}
label {
    color: var(--col-text-orange3);
}
    }
}

.portalforms-header-button {
    margin: 8px;
}


.portalform-with-notes {
    /*display: contents;*/ /*Messes with dropdown width*/
}

.portalform-without-notes {
    
}

.portalform-header-button {
    width: 100%;
    padding: 0px !important;
    border-radius: initial;
    background-color: var(--col-bg-orange1) !important;
    border-width: 0px;
}
.portalform-header-button.show {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.portalform-notes {
    width: 100%;
    background-color: var(--col-bg-orange2);
    border-width:2px;
    border-color: var(--col-border-black);
    min-height: 100px;
    word-wrap: break-word;
}
.portalform-notes.show {
    padding-top: 2px;
    border-radius: 0px;
}
.portalform-checkbox {
    
}

.result-view-list {
    border-color: var(--col-border-gray);
    .result-view
    {
        margin-top: 4px;
        margin-bottom: 4px;
    }
}

.result-view {
    border-color: var(--col-border-gray);
    border-style: solid;
    border-width: 2px;
    font-style: normal;

    div {
            color:var(--col-text-black);
            text-shadow:none;
        }

label {
    color: var(--col-text-black);
    text-shadow: none;
}

    .lbl {
        font-size: larger;
    }

    .field {
        font-style: normal;
        font-weight: normal;
    }

}

.result-view-admin {
    padding: 4px;
    border-width:0px;
    border-top-width: 2px;
    border-style: dotted;
    .pagination

{
    width: fit-content;
    .page-item:last-child {
                              display:none;
                          }



.page-item:first-child {
    display: none;
}
}

}

.admin-section {
    border-color: var(--col-border-gray);
    border-width: 2px;
    border-style: solid;
    margin-bottom: 16px;
    padding: 8px;
    h4 {
           text-align: center;
       }
.form-label {
    color: var(--col-text-black);
}
}

.admin-message {
    color: var(--col-text-white);
    font-weight: 400;
}

#FormResultView {
}

.pdf-export-view {
    background-color: var(--col-export-bg) !important;
    border-color: var(--col-export-border) !important;
    color: var(--col-export-text1) !important;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    label
{
    color: var(--col-export-text1) !important;
}

.pdf-export-header {
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    font-size: x-large;
    font-weight: bold;
}
.pdf-export-field-title {
    border-width: 0px;
    border-style: none;
}
.pdf-export-field-value {
    /*div
    {
        color: var(--col-export-text1) !important;
        border-color: var(--col-export-border) !important;
    }*/
}

.pdf-export-internal {
    /*color: var(--col-export-text1) !important;
    border-color: var(--col-export-border) !important;*/
}


div {
    /*color: var(--col-export-text1) !important;
    border-color: var(--col-export-border) !important;*/
}

li {
    /*color: var(--col-export-text1) !important;
    border-color: var(--col-export-border) !important;*/
}

.form-label {
    color: var(--col-export-text1) !important;
}

.lbl {
    color: var(--col-export-text1) !important;
    font-size: larger;
}

.portalform-list {
    background-color: var(--col-export-bg) !important;
    color: var(--col-export-text1) !important;
}
}

#FormResultControls {
}



#SubLandingInfo {
}

#LandingInfoAboutUs {

}
#LandingInfoHowItWorks {

}
.landing-info-container {
    margin: 12px;
    padding-top: 32px;
    min-height: 150px;
    border-width: 2px;
    border-style: solid;
    border-color: var(--col-border-gray-transparent);
    img

{
    display: block;
    width: 100%;
    margin-block:auto;
    justify-self:center;
    /*position:relative;
    bottom:40px;*/
}

}
.landing-info-header {
    font-size:x-large;
}
.landing-info-image-col{
    display:grid;
    
}

.landing-info-video-col {
    display: grid;
    video

{
    width: 100%;
    max-width: 640px;
    margin-left:auto;
    margin-right:auto;
}
}

.landing-info-video-side-col {
    display: flex;
    flex-direction: column;
    margin: auto;
    img {
            margin-top:8px;
        }
}

.landing-info-content {
    font-size: large;
    font-weight: 400;
    p
{
    display: block;
}

}

    #SubFAQ {
        .faq-entry-list
    {
        max-height: 700px;
        overflow-y: scroll;
    }

}

#SubPortalForms {
    .outer
{
    max-height: 314px;
    overflow-y: scroll;
}
    .portalform-list
    {
        max-height:unset;
        overflow-y:unset;
    }
}

#SubContact {
}

#Admin {
    background-color: var(--col-bg-white);
    padding:12px;
}

.html-view {
    
}
}
.html-view-outer {
    background-color: var(--col-bg-gray);
}
.html-view-header {
    color:var(--col-text-black);
}

.contact-button {
    min-height: 30px !important;
    min-width: 30%;
    margin-left: 24px;
    margin-right: 24px;
}


.sub {
    border-style: outset;
    border-color: rgba(0,0,0,0.15);
    border-width: 4px;
    border-radius: 4px;
    border-bottom-width: 6px;
    
    margin-bottom: 24px;
    width: max(80%, 120px);
    background-color: var(--col-bg-white);
    div
{
    color: var(--col-text-black);
    text-shadow: none;
}

h3 {
    text-shadow: 0px 1px var(--col-text-shadow-dark);
    text-decoration:underline;
}
}

#Main {
    align-content: center;
    justify-content: center;
    justify-items: center;
    align-items: center;
    text-align: center;
    
}

#Title {
    text-align: center;
}

article {
    padding-left: 0px;
    padding-right: 0px;
}

html {
    background-color: var(--col-bg-gray);
}

body {
    background-image: linear-gradient(var(--col-bg-black), var(--col-bg-gray));
    font-family: var(--font-text-1);
    /*text-shadow: 0px 1px var(--col-text-shadow);*/
    font-weight: 800;
}


.faq-entry-list {
    background-color: var(--col-bg-white);
    border-radius: 4px;
    border-style:solid;
    border-width:4px;
    padding: 10px;
}
.faq-entry-view {
    font-style: normal;
    margin-left: min(32px,5%) !important;
    margin-right: min(32px,5%) !important;
    max-width: none;
    color: var(--col-text-black);

    label
    {
        color: var(--col-text-black);
    }
}
.faq-entry-name {
    font-size: x-large;
    font-weight: bold;
}
.faq-entry-info {
    margin: 16px;
    font-size: medium;
    font-weight: initial;
}
.faq-entry-info-container {
    background-color: var(--col-bg-orange1);
    min-height:100px;
}
.faq-show-more {
    padding: 24px;
    a
{
    padding: 16px;
    font-size: x-large;
    font-weight: 900;
}
    
}


[class^="icon-"], [class*=" icon-"] {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-top: 1px;
    *margin-right: .3em;
    line-height: 14px;
    vertical-align: text-top;
    background-image: url(https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.2/img/glyphicons-halflings.png);
    background-position: 14px 14px;
    background-repeat: no-repeat;
}

.bootstrap-checkbox {
    display: inline-block;
    position: relative;
    width: 13px;
    height: 13px;
    border: 1px solid #000;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .bootstrap-checkbox i {
        position: absolute;
        left: -2px;
        top: -3px;
    }

.icon-stop {
    background-position: -312px -72px;
}

.icon-check {
    background-position: -288px 0px;
}

.header {
    max-height:32px;
}

.back-button {
    max-height:inherit;
    margin-right: 24px;
    font-size:large;
    display:inline-block !important;
    float:left;
}

.copyright {
    display: block;
    float: left;
    p {
          font-weight: 400;
      }
}

#ContactUs {
    display: inline-block;
    float: right;
    li::marker{
        font-size: 1.2em;
        content: "";
    }

    li {
        color: var(--col-text-orange2) !important;
    }
    a {
        color: var(--col-text-orange2) !important;
    }
    
}

.legal-section {
    margin-bottom:12px;
}

#Legal {
    margin-left: min(20%,128px);
    margin-right: min(20%,128px);
}

#Footer {
    padding-top:32px;
}

.content {
    padding-bottom: 10px;
}


.nav-link-button {
    padding-left: 3em;
    padding-right: 3em;
    padding-top: 24px;
    padding-bottom: 24px;
    font-size: x-large;
    font-weight: 800;
}

.dg-button {
    border-color: var(--col-border-white);
    color: var(--col-link-black);
    background-color: var(--col-bg-orange2);
    font-family: var(--font-text-1);

    .disabled
    {
        opacity: 0.4;
        color: var(--col-text-white) !important;
    }
    
}

.doc-link-icon {
    block-size: 16px;
    display:inline-block;
}

.doc-link {
    color: var(--col-text-white)
}


h1 {
    font-weight: 900;
    text-align: center;
}

h2 {
    color: var(--col-sub-orange);
    text-shadow: 1px 1px var(--col-text-shadow);
    font-weight: 800;
}
h3 {
    color: var(--col-sub-orange);
    text-shadow: 1px 1px var(--col-text-shadow);
    font-weight: 700;
    font-stretch:expanded;
}
h4 {
    color: var(--col-sub-orange);
    text-shadow: 1px 1px var(--col-text-shadow);
    font-weight: 700;
}
h5 {
    color: var(--col-sub-orange);
    /*text-shadow: 1px 1px var(--col-text-shadow);*/
    font-weight: 400;
}

@layer def {

    li:not([class*="export"]) {
        font-family: var(--font-text-1);
        color: var(--col-text-white);
    }

    a:not([class*="export"]) {
        font-family: var(--font-text-2);
        font-size: larger;
        font-weight: bold;
        color: var(--col-text-orange2);
        text-decoration: underline;
    }

    label:not([class*="export"]) {
        font-family: var(--font-text-1);
        color: var(--col-text-white);
    }


    div:not([class*="export"]) {
        font-family: var(--font-text-1);
        color: var(--col-text-white);
    }
}

#blazor-error-ui {
    color: var(--col-text-black);
}

:root {
    --font-text-1: "Poppins";
    --font-text-2: "Roboto";
    --col-bg-black: #000000ff; /*#ff6A00ff;*/
    --col-bg-gray: #222222ff; /*#BC4B00;*/
    --col-bg-gray2: #444444ff;
    --col-bg-gray3: #666666ff;
    --col-bg-white: #ffffffff;
    --col-bg-orange1: #FF8432;
    --col-bg-orange2: #FF6A32;
    --col-text-white: #ffffffff;
    --col-text-orange: #e08b36ff;
    --col-text-orange2: #FFBE66;
    --col-text-red: red;
    --col-text-orange3: #FFBF71;
    --col-text-black: #000000ff;
    --col-text-shadow: #ffffff99;
    --col-text-shadow-light: #ffffff99;
    --col-text-shadow-dark: #00000099;
    --col-sub-orange: #f85d08ff;
    --col-border-white: #ffffffff;
    --col-border-gray: #222222ff;
    --col-border-gray-transparent: #00000011;
    --col-border-black: 000000ff;
    --col-link-yellow: #fff400ff;
    --col-link-black: #000000ff;
    --col-link-black-disabled: #11111111;
    --col-button-white: #ffffffff;
    --col-button-black: #000000ff;
    --col-button-black-disabled: #00000011;
    --col-export-bg: #ffffffff;
    --col-export-border: #00000099;
    --col-export-text1: #000000ff;
    /*Upload*/
    --col-upload-base: rgb(from var(--col-text-orange2) r g b / calc(alpha * 0.5) );
    --col-border-upload: rgb(from var(--col-upload-base) r g b / calc(alpha * 0.5) );
    --col-bg-upload-hover: rgb(from var(--col-upload-base) r g b / calc(alpha * 0.75) );
    --col-border-upload-hover: rgb(from var(--col-upload-base) r g b / calc(alpha * 2.0) );
    --col-bg-upload-enter: rgb(from var(--col-upload-base) r g b / calc(alpha * 1.0) );
    --col-border-upload-enter: rgb(from var(--col-upload-base) r g b / calc(alpha * 2.0) );
    --col-bg-upload: rgb(from var(--col-upload-base) r g b / calc(alpha * 0.5) );
}



.btn-dark {
    --bs-btn-color: var(--col-button-black);
    --bs-btn-bg: var(--col-bg-orange1);
    --bs-btn-border-color: var(--col-border-black);

    --bs-btn-hover-color: var(--col-button-black);
    --bs-btn-hover-bg: var(--col-bg-orange2);
    --bs-btn-hover-border-color: var(--col-border-black);

    --bs-btn-focus-shadow-rgb: var(--col-text-shadow);

    --bs-btn-active-color: var(--col-button-black);
    --bs-btn-active-bg: var(--col-bg-orange2);
    --bs-btn-active-border-color: var(--col-bg-orange1);
    --bs-btn-active-shadow: var(--col-text-shadow);

    --bs-btn-disabled-color: var(--col-button-black);
    --bs-btn-disabled-bg: var(--col-bg-gray);
    --bs-btn-disabled-border-color: var(--col-border-gray-transparent);
}