/*
    @media (min-width: 1200px) {    L
    @media (min-width: 992px) {     M
    @media (min-width: 768px) {     S
    @media (max-width: 767px) {}    XS

@media (min-width: 1200px) {
}

@media (min-width: 992px) and (max-width: 1199px) {
}

@media (min-width: 768px) and (max-width: 991px) {
}

@media (max-width: 767px) {
}
*/

/*
    FONTS
*/
@font-face {
    font-family: "OpenSans Light";
    src: url("/Fonts/OpenSans-Light.woff2?v=1.1.0") format("woff2"), url("/fonts/OpenSans-Light.woff?v=1.1.0") format("woff");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "OpenSans Reg";
    src: url("/Fonts/OpenSans-Regular.woff2?v=1.1.0") format("woff2"), url("/fonts/OpenSans-Regular.woff?v=1.1.0") format("woff");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "OpenSans Bold";
    src: url("/Fonts/OpenSans-Bold.woff2?v=1.1.0") format("woff2"), url("/fonts/OpenSans-Bold.woff?v=1.1.0") format("woff");
    font-weight: bold;
    font-style: normal;
}


/*
    PAGE STRUCTURE
*/
html,body {
    height: 100%;
}
#body {
    min-height: 100%;
    /* equal to footer height */
    margin-bottom: -100px;
    /* fixes by peter to be able to center child content */
    position: relative;
/*    padding-left: 15px;
    padding-right: 15px;*/
}
#body:after {
  content: "";
  display: block;
}
#footer, #body:after {
    height: 100px;
/*	padding-top: 30px;*/
}
#footer {
    position: relative;
    z-index: 9999;
    padding-top: 30px;
    text-align: center;
/*    line-height: 40px;*/
    background-color: #e8e8e3;
    color: #777;
}
#footer-hr  {
    border-top: solid 2px #fff;
    padding: 20px;
}
#footer a {
    color: #858585;
}

@media (min-width: 1200px) {
    #pagewrapper {
        margin-top: 160px;
    }

    .container, .container-lg {
        max-width: 1140px;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    #pagewrapper {
        margin-top: 120px;
    }
}

@media (max-width: 767px) {
    #pagewrapper {
        margin-top: 102px;
    }
}

/*
    NAV BAR
*/

#top-navbar {
    background: #fff;
    box-shadow: none;/*0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 5px rgba(0, 0, 0, 0.075);*/
    z-index: 1071;
    padding: 0 !important;
}

#navbar-3col-wrapper h1,
#navbar-3col-wrapper {
    height: 108px;
    line-height: 102px;
}

#navbar-2col-wrapper h1,
#navbar-2col-wrapper { /* only visible on xs */
    height: 80px;
    line-height: 80px;
}

#navbar-logo:hover {
    text-decoration: none;
}

#top-navbar h1 {
    color: #000;
    margin: 0;
}

#navbar-3col-wrapper {
    position: relative;
}

@media (min-width: 1200px) {
    #navbar-3col-wrapper {
        font-size: 16px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    #navbar-3col-wrapper {
        font-size: 14px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #navbar-3col-wrapper {
        font-size: 12px;
    }
}

/* 3-left col */
#navbar-logo {
    margin-left: 46px;
}

/* 3-center col */
#navbar-centercol {
    text-align:center;
    width: 300px;
}

/* 3-right col */
#navbar-logininfo {
    margin-right: 46px;
}

#navbar-hiddenmenu {
    background-color: #ffffff;
    border-bottom: solid 1px #e8e8e3;
    text-align: center;
}

#navbar-hiddenmenu .frf-menu {
    padding-top: 60px;
}

#navbar-hiddenmenu li {
    vertical-align: top;
}

#navbar-wrapper { display:none; }

#navbar-hiddenmenu .frf-bg-wrapper {
    padding-top: 0;
    height: 110px;
}

#navbar-hiddenmenu .frf-menuitem-name { padding-top: 0; }

#lnk-hiddenmenu {
    background: url('/Images/menu-arrows.png') no-repeat 0 0;
    margin-left: 10px;
    padding-left: 34px;
}

#lnk-hiddenmenu[aria-expanded="true"] {
    background: url('/Images/menu-arrows.png') no-repeat 0 -20px;
}

/*
    FRF MENU
*/


.frf-menu > li {
    text-align: left;
/*    padding-left: 15px;
    padding-right: 15px;*/
}

.frf-menuitem {
    vertical-align: top;
    text-align: center;
}


.frf-bg-wrapper {
    background-color: #fff;
    width: 189px;
    height: 183px;
    padding-top: 45px;
}

.frf-description-wrapper {
    width: 189px;
    height: 94px;
}

.frf-menuitem-bg {
    height: 92px;
    width: 110px;
    margin: 0 auto 20px auto;
    background: url('/Images/menuicons.png') no-repeat;

}

.frf-menuitem-name {
    white-space: nowrap;
    padding-top: 20px;
    color: #000;
}

.frf-menuitem-active .frf-menuitem-name { color: #da291c; }

.frf-menuitem:hover .frf-menuitem-name { display:none; }

.frf-menuitem-description {
    display:none;
    padding: 10px 20px;
    font-size: 0.9em;
}

.frf-menuitem:hover .frf-menuitem-description { display: block; }

.frf-menu .bg-offset-0 { background-position: 0 0;  }
.frf-menu .bg-offset-1 { background-position: -110px 0;  }
.frf-menu .bg-offset-2 { background-position: -220px 0;  }
.frf-menu .bg-offset-3 { background-position: -330px 0;  }
.frf-menu .bg-offset-4 { background-position: -440px 0;  }
.frf-menu .bg-offset-5 { background-position: -550px 0;  }
.frf-menu .bg-offset-6 { background-position: -660px 0;  }
.frf-menu .bg-offset-7 { background-position: -770px 0;  }
.frf-menu .bg-offset-8 { background-position: -880px 0;  }
.frf-menu .bg-offset-9 { background-position: -990px 0;  }
.frf-menu .bg-offset-10 { background-position: -1100px 0;  }

/*
.frf-menuitem-active .frf-menuitem-bg,
.frf-menuitem:hover .frf-menuitem-bg {
    background-position-y: -92px;
}
*/
.frf-menuitem-active .bg-offset-0,
.frf-menuitem:hover .bg-offset-0 { background-position: 0 -92px;  }
.frf-menuitem-active .bg-offset-1,
.frf-menuitem:hover .bg-offset-1 { background-position: -110px -92px;  }
.frf-menuitem-active .bg-offset-2,
.frf-menuitem:hover .bg-offset-2 { background-position: -220px -92px;  }
.frf-menuitem-active .bg-offset-3,
.frf-menuitem:hover .bg-offset-3 { background-position: -330px -92px;  }
.frf-menuitem-active .bg-offset-4,
.frf-menuitem:hover .bg-offset-4 { background-position: -440px -92px;  }
.frf-menuitem-active .bg-offset-5,
.frf-menuitem:hover .bg-offset-5 { background-position: -550px -92px;  }
.frf-menuitem-active .bg-offset-6,
.frf-menuitem:hover .bg-offset-6 { background-position: -660px -92px;  }
.frf-menuitem-active .bg-offset-7,
.frf-menuitem:hover .bg-offset-7 { background-position: -770px -92px;  }
.frf-menuitem-active .bg-offset-8,
.frf-menuitem:hover .bg-offset-8 { background-position: -880px -92px;  }
.frf-menuitem-active .bg-offset-9,
.frf-menuitem:hover .bg-offset-9 { background-position: -990px -92px;  }
.frf-menuitem-active .bg-offset-10,
.frf-menuitem:hover .bg-offset-10 { background-position: -1100px -92px;  }


@media (max-width: 400px) {
    .frf-bg-wrapper {
        width: 129px;
        height: 123px;
        padding-top: 17px;
    }
    .frf-description-wrapper {
        width: 129px;
    }
    .frf-menuitem-description {
        padding: 5px;
    }
}


/*
    WIDGETS
*/

.frf-widget {
    position: relative;
    background-color: #ffffff;
    padding-left: 15px;
    padding-right: 15px;
    height: 225px;
}


.frf-widget h3 {
    padding-top: 15px;
    margin-top: 0;
}

.frf-widget ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.frf-widget ul li {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.frf-widget td {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.frf-widget-table-container {
    overflow: hidden;
}

/*
    BASE ELEMENTS
*/

a, a:visited, a:focus, a:active, a:hover { outline: 0 none !important; }
option,
option:focus,
option:active,
{ outline: 0 none !important; }
select,
select:active,
select:focus {
    outline: 0 none !important;
}
button { outline: 0 none !important; }

body {
    background-color: #e8e8e3;
    font-family: "OpenSans Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    line-height: 1.42857143;
    color: #333;
}

b, strong, .bold {
    font-family: "OpenSans Bold";
}

label {
    font-weight: normal;
}

a { color: #da291c; }
a:link, a:visited, a:hover, a:active { color: #da291c; text-decoration: none; }
a:hover { color: #da291c; text-decoration: underline; }
a.btn { color: #fff; }

hr {
    border-color: #fff !important;
    color: #fff !important;
    border-width: 3px 0 0 0 !important;
    opacity: 1 !important;
    height: 3px !important;
}

h1 {
    font-size: 32px;
}

h2 {
    font-size: 32px;
}


h4 {
    color: #da291c;
    font-size: 51px;
}

.table > thead > tr > th {
    font-family: "OpenSans Bold";
    font-size: 16px;
    background-color: transparent;
}
.table th a {
    color: #000;
}
.table th a:hover {
    color: #000;
}
.table > tbody > tr > td a {
    color: #000;
}
.table > tbody > tr > td a:hover {
    color: #da291c;
}
.table > tbody > tr > td {
    color: #858585;
    background-color: transparent;
}

.table-with-input>tbody>tr>td {
    vertical-align: middle;
}

.checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"],
.radio input[type="radio"], .radio-inline input[type="radio"], 
.form-check input[type="checkbox"], .form-check input[type="radio"],
.form-check-inline input[type="checkbox"], .form-check-inline[type="radio"] {
    margin-top: 7px;
}

.form-check-inline label {
    margin-left: 0.25rem;
}

.list-group-item {
    list-style: none;
    background-color: #f0f0f0;
}

.bi { vertical-align: middle }

/* Hide arrows for numeric inputs */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

/*
    BOOTSTRAP MISC OVERRIDE
*/
/*.navbar {
    padding: 0;
}*/
.hide {
    display: none !important;
}

/*
   BOOTSTRAP FORM OVERRIDE
*/

.date {
    width: 160px;
}
.date.full-width{ width: auto; }

.input-group-addon {
    border:none;
     -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

select option {
    padding-top: 4px;
    padding-bottom: 4px;
}

.form-control {
    height: 54px;
    border-color: #fff;
    -webkit-box-shadow: none;
    box-shadow: none;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    font-size: 17px;
}

.panel .form-control .card {
    border-color: #ccc;
}

.form-control-static, .form-control-plaintext {
    height: 54px;
    line-height: 40px;
}

.multiline-table-cell {
    padding: 7px 0;
    margin-bottom: 0;
}

.multiline-table-cell span,
.multiline-table-cell .cell-divider {
    display: inline-block;
    width: 100%;
    padding: 4px;
}
.multiline-table-cell .cell-divider { background-color: rgba(255, 255, 255, 0.7); }

.form-inline .btn-primary,
.input-group .btn-primary {
    height: 54px;
    margin-left: 10px !important;
}

.checkbox-inline {
    display: inline-block;
    padding-left: 1.5rem;
    margin-bottom: 0;
    vertical-align: middle;
    font-weight: normal;
    cursor: pointer;
}

/* Need this one since we have higher input elements */
.form-horizontal .col-form-label {
    padding-top: 14px;
}

/* detta ska inte behövas om vi omsluter kolumnen i en .row */
/*.horiz-group .form-group  .col-md-6 { padding: 0; }
.horiz-group .form-group  .col-md-6.first { padding-right: 15px; }*/

.input-group-btn .tooltip .tooltip-inner { white-space: normal; }

.helptext span {
    color: #777;
    font-family: "OpenSans Light";
    font-size: 16px;
    display: inline-block;
}

@media (min-width: 768px) {
    .with-helpttext .form-control {
        width: 60%;
        float: left;
    }

    .with-helpttext .input-group,
    .with-helpttext .form-group {
        width: 60%;
        float: left;
    }

    .with-helpttext .input-group .form-control,
    .with-helpttext .form-group .form-control {
         width: 100%;
         float:none;
    }

}

.with-helpttext .list-group { width: 60%; }


@media (min-width: 768px) {
    .with-helpttext .helptext {
        width: 40%;
        height: 54px;
        line-height: 54px;
        padding-left: 40px;
        float: right;
    }

    .with-helpttext .helptext span {
        vertical-align: middle;
        display:inline-block;
        line-height: 1.42857;
    }
}

.focused .helptext span {
    color: #00629b;
}

#frf-modals .searchstring,
#body .searchstring {
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    border-radius: 30px;
    padding-left: 60px;
    background: url('/Images/searchicons.png') no-repeat 20px -3px #fff;
}

#frf-modals .searchstring:hover,
#body .searchstring:hover {
    background-position: 20px -63px;
}

#frf-modals .searchstring.active,
#frf-modals .searchstring:active,
#frf-modals .searchstring:focus,
#body .searchstring.active,
#body .searchstring:active,
#body .searchstring:focus {
    background-position: 20px -123px;
}

/*
    PAGER
*/
.pagination > .page-item, li > span {
    color: #23527c;
    padding: 6px 12px;
}

.pagination > .page-item, li > .page-link {
    color: #337ab7 !important; /* TODO: Color? */
}

.pagination > li, .page-item > span:hover {
    background-color: #fff;
    color: #23527c;
}

.pagination > li, .page-item > .disabled:hover,
.pagination > li, .page-item > .disabled {
    background-color: #e8e8e8;
    color: #777;
}

/*
    FORM
*/

.caron {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 4px solid;
    display: inline-block;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    width: 0;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.frf-inline-flex {
    display: inline-flex;
    align-items: center;
}

.frf-display-form label {
    font-family:"OpenSans Bold";
}

.frf-display-form .col-form-label {
    text-align: left;
}

.frf-display-form .form-group {
    border-top: 1px solid #dddddd;
    margin-bottom: 7px;
    padding-top: 7px;
}
.frf-display-form .form-group:first-child {
    border: none;
}

.frf-form-minheight {
    min-height: 80vh;
}

.frf-form-state-loading { position: relative; }
.frf-form-state-loading .loading-element {
    position: absolute;
    top: 0; right: 0;
    left: 0; bottom: 0;
    background-color: #e8e8e3;
    z-index: 200;
    opacity: 0.5;
    pointer-events: visiblepainted;
}
.frf-form-state-loading .loading-element:after {
    content: "";
    position: fixed;
    top: 50%; left: 50%;
    width: 48px; height: 48px;
    border-radius: 50%;
    border-width: 4px;
    border-color: #333;
    border-top-color: transparent;
    border-style: solid;
    -webkit-animation: rotating 1s linear infinite;
    -moz-animation: rotating 1s linear infinite;
    -ms-animation: rotating 1s linear infinite;
    -o-animation: rotating 1s linear infinite;
    animation: rotating 1s linear infinite;
}
.frf-form-state-loading.frf-loading-state-inparent .loading-element:after {
    position: absolute;
}

.text-warning-custom {
    color: #8a6d3b !important;
}

@-webkit-keyframes rotating /* Safari and Chrome */ {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/*
    BUTTON OVERRIDES
*/

.btn {
    border: none;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 18px;
    font-family: "OpenSans Reg";
    box-shadow:none;
}


.btn-primary {
    background: #00629b;
}
.btn-primary:hover {
    background-color: #1b7cb5;
}

.btn-default,
.btn-secondary {
    background-color: #f1f1ee;
    color: #333 !important;
}
.btn-default:hover,
.btn-secondary:hover {
    background-color: #fff;
}

.btn-round {
    -moz-border-radius: 29px;
    -webkit-border-radius: 29px;
    border-radius: 29px;
}

.btn-white {
    background-color: #fff;
    color: #000;
}

.btn-white.active,
.btn-white:active {
    background-color: #00629b !important;
    color: #fff !important;
}

.btn-danger {
    background-color: #d9534f !important;
    border-color: #d43f3a !important;
    color: white;
}

.btn-danger:hover {
    background-color: #c9392c !important;
    border-color: #ac2925 !important;
}

.btn-warning {
    background-color: #f0ad4e !important;
    border-color: #eea236 !important;
    color: white;
}

.btn-warning:hover {
    background-color: #ec971f !important;
    border-color: #d58512 !important;
}


/*
    MODAL BOOTSTRAP OVERRIDES
*/

.modal .modal-content {
    height: 100%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    border: none;
}

/*
    VALIDATION
*/

.field-validation-error {
    display: none;
}
.field-validation-valid {
    display: none;
}

.frf-alert-red {
    background-color: #fff;
    border: 2px solid #da291c;
    padding: 20px;
}

.frf-alert-success {
    background-color: #fff;
    border: 2px solid #00629b;
    padding: 20px;
}

/*
    FRF MODAL
*/

.hide-scroll { overflow: hidden;}
.frf-modal {
    position: fixed;
    width: 100%;
    height: 100%; /* removed because of bug where you could see elements behind popup */
    top: 0;
    left:0;
    background-color: #e8e8e3;
    z-index: 1080;
    overflow: auto;
}

.frf-modal-close {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 0px;
    right:0px;
    background: url('/Images/closepopup.gif') #f9f9f9 no-repeat 50% 50%;
    cursor: pointer;
}

.frf-modal-content {
    margin-top: 120px;
    padding-bottom: 100px;
}

/*
    FRF GUIDE
*/

.frf-guide .btn .bi {
    margin-left: -10px;
}

.frf-guide .btn-white .bi {
    display: none;
}

.frf-guide .btn-white.active .bi {
    display: inline-block;
}

#working-label {
    width: 100%;
    text-align: right;
    margin-right: 20px;
}

.year {
    width: 66px;
}

.disabled {
    color: #858585;
}

#file-list {
    background-color: white;
    padding: 10px;
}

#file-list > .folder-path { margin-bottom: 4px;
    margin-left: 10px;
}

#file-list > .folder-path > div {
    font-weight: bold;
}

    #file-list > div > a > img {
        width: 12px;
        height: 12px;
        border: none;
        margin-right: 4px;
    }


    #file-list ul {
        list-style: none;
        padding-left: 10px;
        max-width: 800px;
    }

#file-list ul li {
    margin: 0;
    padding-bottom: 4px;
    display: flex;
}

    #file-list ul li img {
        width: 20px;
        height: 20px;
        border: none;
        margin-right: 4px;
    }
#file-list ul li a {
        
        
    }
    #file-list ul li .dots {
        border-bottom: 2px dotted #e8e8e3;
        flex-grow: 1;
        height: 20px;
        margin-left: 5px;
        margin-right: 5px;

    }
#file-list ul li .fixed-dots {
        border-bottom: 2px dotted #e8e8e3;
    width: 20px;
        height: 20px;
        margin-left: 5px;
        margin-right: 5px;

    }

#file-list ul li .file-info {
    align-self: flex-end;
        
    }

/* MISC */

.new-row .action-buttons {
    display: flex;
    gap: 10px;
    align-items: center;
}

.flatpickr-year-select {
    /*appearance: none;*/
    background: transparent;
    border: none;
    /*font-size: 14px;*/
    /*padding: 0 5px;*/
    color: #333;
    cursor: pointer;
    height: auto;
}