/*body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/


/*Overriding colors and other styles for new design. Should probably be done in better way, including removing lots och other unused, unneeded or bad css files. */

/*Classes for new colors*/
.bg-newblue {
    background-color: #056d8d !important;
    color: #f9f9f9 !important;
}

.bg-green {
    background-color: #007F66 !important;
}

.bg-newred {
    background-color: #c13755 !important;
}

a {
    color: #056d8d !important;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    color: #fff !important;
}



/*Override the a override above to fix menu*/
.skin-black .sidebar > .sidebar-menu > li > a:hover,
.skin-black .sidebar > .sidebar-menu > li.active > a {
    color: #f6f6f6 !important;
}

.skin-black .sidebar a,
.skin-black .user-panel > .info > a {
    color: #eee !important;
}

/*Fix link colors id ddl*/
ul.dropdown-menu>li>a {
    color: #333 !important;
}

.btn.btn-primary {
    color: #FFFFFF !important;
    background-color: #056d8d !important;
    border-color: #045771 !important;
}

.btn.btn-primary:hover,
.btn.btn-primary:active,
.btn.btn-primary.hover {
    background-color: #045771 !important;
}

/*Button colors*/
.btn.btn-danger {
    color: #FFFFFF !important;
    background-color: #c13755 !important;
    border-color: #c02c2e !important;
}

.btn.btn-green {
    color: #fff !important;
    background-color: #007f66 !important;
    border-color: #006648 !important;
}

.btn.btn-green:hover,
.btn.btn-green:active,
.btn.btn-danger.hover {
    background-color: #006648 !important;
}

.btn.btn-danger:hover,
.btn.btn-danger:active,
.btn.btn-danger.hover {
    background-color: #c02c2e !important;
}


.panel-primary > .panel-heading {
    color: #f9f9f9;
    background-color: #056d8d;
    border-color: #056d8d;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: #056d8d;
    border-color: #056d8d;
}

/*Override user menu*/
.navbar-nav > .user-menu > .dropdown-menu {
    width: 400px !important;
    margin-right: 15px;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    height: auto !important;
}


.custom-skin .left-side {
    background-color: #056d8d;
    color: black !important;
}

.custom-skin .sidebar {
    color: white !important;
}



.custom-skin .sidebar .sidebar-menu a.sideBarLink {
    color: white !important;
}

.custom-skin .sidebar .sidebar-menu a.sideBarLink:hover,
.custom-skin .sidebar .sidebar-menu .active a.sideBarLink {
    background-color: #045771 !important;
}

.custom-skin .sidebar-offcanvas,
.custom-skin .sidebar-offcanvas a {
    color: white !important;
}

.custom-skin .user-panel {
    /*border-bottom: 1px #a2d0df solid;*/
    border-bottom: 1px #809ab2 solid;
}

a.navbar-brand {
    background-color: #056d8d !important;
    padding: 0px;
}


/*Articles*/
.imageContainer {
    /*max-height: 300px;*/
    height: 300px;
    overflow-y: hidden;
}

.imageContainer img {
    max-width: 100%;
    min-width: 100%;
}

/*.imageContainer iframe {
    max-width: 100%;
    max-height: 100%;
    min-width: 100%;
}*/

.contentContainerInner {
    overflow-y: hidden;
}

.contentContainer.closed .contentContainerInner {
    height: 100px;
    -webkit-mask-image: linear-gradient(to bottom, black calc(100% - 40px), rgba(255, 255, 255, 0.25) calc(100% - 16px), transparent);
}

.contentContainer a.showMore {
    font-style: italic;
}

.contentContainer a.showMore:after {
    content: 'Läs mindre';
}

.contentContainer.closed a.showMore:after {
    content: 'Läs mer';
}


/*BookingCalendar*/

.bg-availableslot {
    background-color: #d6f9cc !important;
}

.slotbutton {
    border: 1px solid #878787;
    border-radius: 3px;
}

/*Make modal scrollable*/

.modal-body {
    max-height: calc(100vh - 212px);
    overflow-y: auto;
}

/*New login page*/

.box-body.login {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

.login-view {
    display: none;
    flex-direction: column;
    justify-content: end;
    flex-grow: 1;
}

.login-view.visible {
    display: flex;
}

.qr-box {
    border: 1px solid #000000;
    width: calc(100vw - 40px);
    max-width: 400px;
    height: calc(100vw - 40px);
    max-height: 400px;
    box-sizing: border-box;
    margin: 0 auto;
}

.qr-canvas {
    width: 100%;
    height: auto;
    margin: 50px;
}

.btn>img {
    vertical-align: middle;
    margin-left: 8px;
    width: 32px;
    height: 32px;
}

.login-image-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    flex-grow: 1;
}

.login-image-box .login-image-inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
}