body
{
    padding-bottom: 40px;
    padding-top: 50px;
    font-size: 14px; /*10px;*/
    /*background-image: linear-gradient(to top, #dff3e9 0%, #fafafa 100%);*/
    /*Teams style background*/
    background-color: #f2f3f1;
    /*background-image: url('/photos/bg_gekko.jpeg');
    background-position: right;
    background-size: cover;*/
    /*overflow-y: scroll;*/
    height: 100vh;
    overflow: hidden;
}

    body.iphone,
    body.android,
    body.ipad
    {
        font-size: 14px;
    }

    body.norole
    {
        overflow-y: scroll;
    }

.container-fluid.main
{
    padding-right: 0px;
    padding-left: 0px;
    position: fixed; /*Kanske för att undvika scroll på iPad*/
    overflow: hidden;
}

body.norole .container-fluid.main
{
    position: relative;
    /*overflow-x: hidden;
    overflow-y: scroll;*/
}

.dropdown-menu > li > a
{
    display: block;
    padding: 3px 15px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    font-size: 14px;
}

.dropdown-menu > li:hover
{
    background-color: #eee;
}

a
{
    text-decoration: none;
}

#splash2
{
    position: fixed;
    z-index: 2000;
    margin: auto;
    text-align: center;
    top: 51px;
    left: 0;
    width: 100%;
    height: 100%;
    width: calc(100vw - 15px);
    height: 100vh;
    color: #fff;
    background-image: linear-gradient(to top, #dff3e9 0%, #fafafa 100%);
    transition: opacity 0.5s linear;
}

    #splash2, #splash2 > p
    {
        color: #31c430;
    }

        #splash2 > h1
        {
            position: absolute;
            left: 45%;
            left: calc(50vw - 70px);
            top: 50%;
            top: calc(50vh - 70px);
        }

#preloader-5
{
    position: relative;
    height: 200px;
    width: 200px;
    left: calc(50vw - 100px);
    top: calc(50vh - 30px);
    transform: translateX(-100px) translateY(-100px);
}

    #preloader-5 span
    {
        position: absolute;
        width: 100%;
        height: 100%;
        border: 10px solid #31c430;
        border-radius: 999px;
        animation: radar 2s infinite linear;
        opacity: 0;
    }

        #preloader-5 span:nth-child(1)
        {
            animation-delay: 0s;
        }

        #preloader-5 span:nth-child(2)
        {
            animation-delay: 0.66s;
        }

        #preloader-5 span:nth-child(3)
        {
            animation-delay: 1.33s;
        }

@keyframes radar
{
    0%
    {
        transform: scale(0);
        opacity: 0;
    }

    25%
    {
        transform: scale(0);
        opacity: 0.5;
    }

    50%
    {
        transform: scale(1);
        opacity: 1;
    }

    75%
    {
        transform: scale(1.5);
        opacity: 0.5;
    }

    100%
    {
        transform: scale(2);
        opacity: 0;
    }
}

#nav
{
    font-size: 14px;
    margin-bottom: 0px;
    height: 50px;
}

#navbarContent
{
    flex-grow: 0;
    margin-top: 4px;
}

.panel-heading > button
{
    margin-top: -4px;
    margin-right: 20px;
}

#dlgSelectAction
{
    border-color: #d6e9c6;
}

    #dlgSelectAction .modal-header /*success*/
    {
        background-color: #dff0d8;
        color: #3c763d;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
    }

.radarname
{
    font-size: 160%;
}

#radars > li,
#archive_radars > li,
#subscribed > li,
#extra > li,
#template_radars > li,
#published_radars > li
{
    background-color: transparent;
    /*overflow: hidden;*/
    /*border: 1px solid #ccc;*/
}

    #radars > li .row,
    #archive_radars > li .row,
    #subscribed > li .row,
    #extra > li .row,
    #template_radars > li .row,
    #published_radars > li .row
    {
        margin-left: 0;
        margin-right: 0;
    }

    #radars > li div[class*='col-'],
    #archive_radars > li div[class*='col-'],
    #subscribed > li div[class*='col-'],
    #extra > li div[class*='col-'],
    #template_radars > li div[class*='col-'],
    #published_radars > li div[class*='col-']
    {
        padding-left: 0;
        padding-right: 0;
    }

#user-nav-content .shelves > ul > li
{
    background-color: transparent;
}

    #user-nav-content .shelves > ul > li .row
    {
        margin-left: 0;
        margin-right: 0;
    }

    #user-nav-content .shelves > ul > li div[class*='col-']
    {
        padding-left: 0;
        padding-right: 0;
    }


/* Youtube style */
/*2019-06-02 styling för 100% för små skärmar */
body[data-displaymode='imagegrid'] #radars > li,
body[data-displaymode='imagegrid'] #archive_radars > li,
body[data-displaymode='imagegrid'] #subscribed > li,
body[data-displaymode='imagegrid'] #extra > li,
body[data-displaymode='imagegrid'] #template_radars > li,
body[data-displaymode='imagegrid'] #published_radars > li
{
    width: 95% !important;
    width: calc(100% - 60px) !important;
}

/*2021-07-03 styling för 50% för halvsmå skärmar */
@media (min-width: 500px)
{
    body[data-displaymode='imagegrid'] #radars > li,
    body[data-displaymode='imagegrid'] #archive_radars > li,
    body[data-displaymode='imagegrid'] #subscribed > li,
    body[data-displaymode='imagegrid'] #extra > li,
    body[data-displaymode='imagegrid'] #template_radars > li,
    body[data-displaymode='imagegrid'] #published_radars > li
    {
        width: 57.5% !important;
        width: calc(50% - 50px) !important;
    }
}

/*2019-06-02 @media tillagt */
@media (min-width: 880px)
{
    body[data-displaymode='imagegrid'] #radars > li,
    body[data-displaymode='imagegrid'] #archive_radars > li,
    body[data-displaymode='imagegrid'] #subscribed > li,
    body[data-displaymode='imagegrid'] #extra > li,
    body[data-displaymode='imagegrid'] #template_radars > li,
    body[data-displaymode='imagegrid'] #published_radars > li
    {
        width: 412px !important;
        width: var(--thumbw) !important;
    }

    body.ipad[data-displaymode='imagegrid'] #radars > li,
    body.ipad[data-displaymode='imagegrid'] #archive_radars > li,
    body.ipad[data-displaymode='imagegrid'] #subscribed > li,
    body.ipad[data-displaymode='imagegrid'] #extra > li,
    body.ipad[data-displaymode='imagegrid'] #template_radars > li,
    body.ipad[data-displaymode='imagegrid'] #published_radars > li
    {
        width: 362px !important;
        width: var(--thumbw) !important;
    }
}

/* NEW Youtube style */

/*2019-06-02 styling för 100% för små skärmar */
#user-nav-content .shelves > ul > li
{
    width: 95% !important;
    width: calc(100% - 60px) !important;
}

/*2021-07-03 styling för 50% för halvsmå skärmar */
@media (min-width: 500px)
{
    #user-nav-content .shelves > ul > li
    {
        width: 57.5% !important;
        width: calc(50% - 50px) !important;
    }
}

/*2019-06-02 @media tillagt */
@media (min-width: 880px)
{
    #user-nav-content .shelves > ul > li
    {
        width: 412px !important;
        width: var(--thumbw) !important;
    }

    #user-nav-content .shelves > ul > li
    {
        width: 362px !important;
        width: var(--thumbw) !important;
    }
}



#user-nav-content .radardisplay-image
{
    height: calc(var(--thumbw) * 0.55) !important;
}

/*body[data-displaymode='imagelist'] .radardisplay-image
{
    max-width: 400px !important;
}

body.ipad[data-displaymode='imagelist'] .radardisplay-image
{
    width: 230px !important;
    max-width: 230px !important;
}

body[data-displaymode='imagelist'] .list-buttons
{
    float: right;
}*/

.radardisplay-image
{
    /*2019-06-02 Verkar inte behövas*/
    /*width: 400px !important;
    max-width: 400px !important;*/
    overflow: hidden;
    background-color: #ccc;
}

#images_library
{
    position: relative;
}

#images_library_drop_zone
{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    color: #fff;
    font-size: 20px;
    align-items: center;
    justify-content: center;
    z-index: 3;
    pointer-events: none;
}

#images_library_images .radardisplay-image
{
    background-color: #f2f3f1;
}

.radarimage
{
    width: 100%;
    height: 100%;
    transition: all 1600ms cubic-bezier(.03,.98,.52,.99);
    /*Youtube style*/
    /*2019-06-02 testar utan detta*/
    /*width: 400px !important;
    max-width: 400px !important;
    height: 215px !important;
    max-height: 215px !important;*/
}

#images_library_images .radarimage
{
    object-fit: contain;
}

li.list-group-item:hover .radarimage
{
    transform-origin: bottom, center;
    transform: scale(1.1);
}

#imagesUploadProgress
{
    padding: 5px;
    border: 1px solid #ddd;
}

    #imagesUploadProgress > div
    {
        height: 8px;
        background-color: darkgreen;
    }

        #imagesUploadProgress > div:first-child
        {
            font-weight: bold;
            transition: width linear 1s;
        }


#dlgUploadProgress div.obscurer
{
    position: absolute;
    top: 20px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    background: linear-gradient(-180deg, #d8dcd84c 0%, #d8dcd8ff 90%);
}

#dlgUploadProgress .terminate-pending
{
    opacity: 0;
}

    #dlgUploadProgress.terminate-pending .terminate-pending
    {
        opacity: 1;
    }

    #dlgUploadProgress.terminate-pending #btnCancelImagesUpload
    {
        pointer-events: none;
        opacity: 0.5;
    }

#imagesUploadCurrentFile
{
    max-height: 600px;
    overflow: hidden;
}

#user-wrapper
{
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    align-items: center;
    -ms-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

body.iphone #user-wrapper,
body.android #user-wrapper
{
    height: calc(100vh - 159px);
}

#user-nav, #examples-sub-nav
{
    /*font-size: 150%;*/
    width: 100%;
    background: rgba(37,36,35,.05);
    height: 45px;
}

#examples-sub-nav
{
    height: 35px;
    position: fixed;
    top: 95px;
    background: rgb(240 240 240);
}

    #examples-sub-nav > li > a
    {
        line-height: 0.80;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

.shelves, #user-nav
{
    /*2019-06-02*/
    /*width: 412px;*/
    width: 100%;
    /*margin: auto;*/
    /*overflow: hidden;*/
}

.tab-content
{
    height: calc(var(--vh100, 100vh) - 137px);
    overflow-y: auto;
    overflow-x: hidden;
}

.shelves
{
    /*margin-top: 50px;*/
    position: relative;
}

    .shelves > .list-group
    {
    }

#i_shelves
{
    min-height: calc(var(--vh100, 100vh) - 175px);
}

.tabs-content
{
    margin: auto;
    width: 100%;
    /*margin-top: 50px;*/
    display: flex;
    flex-direction: row;
    position: relative;
}

body.norole .tabs-content
{
    display: none;
}

body.iphone .tabs-content,
body.android .tabs-content
{
    margin-top: 0px;
}

body.ipad .tabs-content
{
    /*margin-top: 120px;*/
}

body.iphone .no-iphone,
body.android .no-iphone
{
    display: none !important;
}

.iphone-only
{
    display: none;
}

body.iphone .iphone-only,
body.android .iphone-only
{
    display: initial;
}

    body.iphone .iphone-only.iphone-room-div,
    body.android .iphone-only.iphone-room-div
    {
        display: inline-block;
        width: 100%;
        margin-top: -10px;
        margin-bottom: 5px;
    }

    body.android .iphone-only.iphone-room-div
    {
        margin-top: 0px;
    }


.ip-room
{
    width: 100%;
    font-size: 24px;
    font-weight: 700;
    padding-left: 12px;
}

@media (min-width: 1025px)
{
    body.ipad .tabs-content
    {
        /*margin-top: 60px;*/
    }
}

.radardescription
{
    font-size: 140%;
    color: #333;
}

.radardisplay-timestamp
{
    font-weight: bold;
    color: #777;
}

body[data-displaymode='imagegrid'] .radardisplay-timestamp
{
    text-align: right;
}

/*body[data-displaymode='imagelist'] .radardescription
{
    font-size: 160%;
}*/
body [data-displaymode='imagelist'] #radars > li,
body[data-displaymode='imagelist'] #archive_radars > li,
body[data-displaymode='imagelist'] #subscribed > li,
body[data-displaymode='imagelist'] #extra > li,
body[data-displaymode='imagelist'] #template_radars > li,
body[data-displaymode='imagelist'] #published_radars > li
{
    /*border: 0;*/
    margin-bottom: 24px;
}

body[data-displaymode='imagegrid'] #radars > li,
body[data-displaymode='imagegrid'] #archive_radars > li,
body[data-displaymode='imagegrid'] #subscribed > li,
body[data-displaymode='imagegrid'] #extra > li,
body[data-displaymode='imagegrid'] #template_radars > li,
body[data-displaymode='imagegrid'] #published_radars > li
{
    display: inline-block;
    /*border: 0;*/
    margin-bottom: 30px;
    padding: 5px 5px;
}

#user-nav-content .shelves > ul > li
{
    display: inline-block;
    margin-bottom: 30px;
    padding: 5px 5px;
}

body[data-displaymode='imagegrid'] .radardisplay-description
{
    height: 80px;
    max-height: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.radardisplay-dropdown button::after
{
    display: none;
}

.radardisplay-dropdown .dropdown-menu
{
    /* transform: none !important; */
}


.imagegrid-title
{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-top: 5px;
    position: relative;
}

body[data-displaymode='imagegrid'] .imageDropdown
{
    position: absolute;
    top: 10px;
    right: 0px;
    text-align: end;
}

#images_library.multiple li.selected .imageDropdown
{
    display: none;
}

#btnImagesHammer
{
    pointer-events: none;
    opacity: 0.5;
}

#images_library.multiple #btnImagesHammer
{
    pointer-events: all;
    opacity: 1;
}


body [data-displaymode='imagegrid'] .radarversion
{
    position: absolute;
    bottom: 10px;
    right: -5px;
    text-align: end;
}

body[data-displaymode='imagegrid'] .radardisplay-wrapper
{
    padding-left: 15px;
}

body[data-displaymode='imagegrid'] #radars > li,
body[data-displaymode='imagegrid'] #archive_radars > li,
body[data-displaymode='imagegrid'] #subscribed > li,
body[data-displaymode='imagegrid'] #extra > li,
body[data-displaymode='imagegrid'] #template_radars > li,
body[data-displaymode='imagegrid'] #published_radars > li
{
    border-radius: 0px !important;
    margin-left: 30px;
    box-shadow: #777 4px 4px 10px;
}

#user-nav-content .shelves > ul > li
{
    border-radius: 0px !important;
    margin-left: 30px;
    box-shadow: #777 4px 4px 10px;
}

.list-buttons
{
    text-align: right;
}

.list-btn
{
    margin-bottom: 0px;
    margin-left: 5px;
    display: inline-block;
    position: relative;
}

    .list-btn:first-child
    {
        margin-left: 0px;
    }

    .list-btn > img
    {
        margin: -6px;
        max-width: 38px;
    }

    .list-btn > button
    {
        font-size: 1.4em;
        border: none;
        border-radius: 0px;
    }

.edit-radar-prop, .info-radar-prop
{
    position: absolute;
    right: 0;
    cursor: pointer;
    font-size: 70%;
    top: 12px;
    color: #aaaa33;
    padding: 3px;
    padding-top: 6px;
    padding-bottom: 6px;
}

.info-radar-prop
{
    color: #3391aa;
}

    .edit-radar-prop:hover > i, .info-radar-prop > i
    {
        margin-bottom: 3px;
    }

    .edit-radar-prop:hover, .info-radar-prop:hover
    {
        color: #33aa33;
        background-color: #cecdcd;
    }

    .info-radar-prop:hover
    {
        color: #2d788d;
        background-color: #cecdcd;
    }

/*body[data-displaymode='imagegrid'] #radars > li, body[data-displaymode='imagegrid'] #archive_radars > li, body[data-displaymode='imagegrid'] #subscribed > li
{
    border-radius: 0px !important;
    margin-left: -1px;
}*/


body[data-displaymode='imagegrid'] .list-btn > button
{
    opacity: 0;
}

body[data-displaymode='imagegrid'] .edit-radar-prop
{
    opacity: 0;
}

body[data-displaymode='imagegrid'] .info-radar-prop
{
    opacity: 0;
}

body[data-displaymode='imagegrid'].ipad .list-btn > button, body[data-displaymode='imagegrid'].iphone .list-btn > button, body[data-displaymode='imagegrid'].android .list-btn > button,
body[data-displaymode='imagegrid'].ipad .edit-radar-prop, body[data-displaymode='imagegrid'].iphone .edit-radar-prop, body[data-displaymode='imagegrid'].android .edit-radar-prop,
body[data-displaymode='imagegrid'].ipad .info-radar-prop, body[data-displaymode='imagegrid'].iphone .info-radar-prop, body[data-displaymode='imagegrid'].android .info-radar-prop
{
    opacity: 0.7;
}

body[data-displaymode='imagegrid'] li.list-group-item:hover .list-btn > button,
body[data-displaymode='imagegrid'] li.list-group-item:hover .edit-radar-prop,
body[data-displaymode='imagegrid'] li.list-group-item:hover .info-radar-prop
{
    opacity: 0.8;
}

/*
body[data-displaymode='imagegrid'].ipad .list-btn > button, body[data-displaymode='imagegrid'].iphone .list-btn > button, body[data-displaymode='imagegrid'].android .list-btn > button
{
    opacity: 0.7;
}

body[data-displaymode='imagegrid'] li.list-group-item:hover .list-btn > button
{
    opacity: 0.8;
}*/

body[data-displaymode='list'] .list-btn > button, body[data-displaymode='imagelist'] .list-btn > button
{
    background-color: transparent !important;
}

@media (max-width: 690px)
{
    .list-btn
    {
        margin-bottom: 5px;
    }
}

@media (min-width: 690px) AND (max-width: 1012px)
{
    .list-btn
    {
        margin-bottom: 5px;
    }
}

@media (min-width: 1200px) AND (max-width: 1242px)
{
    .list-btn
    {
        margin-bottom: 5px;
    }
}

#tblRadars td
{
    cursor: pointer;
}

.form-group .with-errors
{
    display: none;
}

.form-group.has-error .with-errors
{
    display: initial;
}

#activitytable
{
    max-height: 300px;
    overflow-y: auto;
}

td.oneliner
{
    white-space: nowrap;
}

.dropdown-toggle
{
    /*border-color: white;*/
    color: #777;
}

li.radaraction:hover, li.createfromsubscribed:hover, li.publishedaction:hover
{
    background-color: #e7e7e7 !important;
    /*background-image: linear-gradient(to top, #eee 0%, #dff3e9 100%);*/
    cursor: pointer;
}


.headline
{
    /*background-image: url(/photos/radar-b3.jpg);*/
    background-image: url(/images/startpage/radarfuture2-1200x500.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-position-y: bottom;
    width: 100%;
    padding: 20px;
    padding-top: 100px;
    padding-bottom: 250px;
}

@media (min-width: 1400px)
{
    .headline
    {
        padding-bottom: 350px;
    }
}

head.ipad .headline
{
    padding-bottom: 20px;
}

head.iphone .headline,
head.android .headline
{
    padding-bottom: 20px;
}

.headline-text
{
    color: white;
    margin-left: 50%;
    font-size: 140%;
}

    .headline-text > h1
    {
        font-size: 40px;
        margin-left: -8px;
    }

#karusell-wrapper
{
    background-color: rgba(255,255,255,0.4);
    margin-top: 20px;
}

#karusell
{
    margin-top: 20px;
}

.carousel-indicators
{
    top: -50px !important;
}

    .carousel-indicators li
    {
        width: 20px;
        height: 20px;
        margin: 2px;
        border: 2px solid #308a30;
        border-radius: 20px;
    }

    .carousel-indicators .active
    {
        width: 24px;
        height: 24px;
        margin: 0px;
        background-color: #308a30;
    }

.carousel-inner > .item, .carousel-inner > .item > div
{
    height: 520px;
    min-height: 520px;
}

.pushers
{
    margin-top: 20px;
}

/* Featurettes
------------------------- */

.featurette-image
{
    width: 100%;
}

.featurette-divider
{
    margin: 40px 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading
{
    font-weight: 300;
    line-height: 1;
    letter-spacing: -1px;
}


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 768px)
{
    .featurette-heading
    {
        font-size: 40px;
    }
}

@media (min-width: 825px)
{
    .headline-text > h1
    {
        font-size: 50px;
    }
}

@media (min-width: 970px)
{
    .headline-text > h1
    {
        font-size: 60px;
    }
}

@media (min-width: 1120px)
{
    .headline-text > h1
    {
        font-size: 70px;
    }
}

@media (min-width: 1280px)
{
    .headline-text > h1
    {
        font-size: 80px;
    }
}

@media (min-width: 992px)
{
    .featurette-heading
    {
        margin-top: 80px;
    }
}

#user_admin_content
{
    position: fixed;
    width: 100%;
    margin-top: -20px;
    margin-left: -15px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 7px;
    padding-top: 10px;
    background-color: #f0f0f0;
    background-color: rgba(240,240,240,0.9);
    z-index: 3;
    border-bottom: #e7e7e7 1px solid;
}

    #user_admin_content .btn
    {
        font-size: 1.4em;
        padding: 6px 12px;
    }

    #user_admin_content .dropdown-menu > li > a
    {
        font-size: 120%;
    }

body.iphone #user_admin_content .btn,
body.android #user_admin_content .btn
{
    font-size: 2.0em;
}

body.iphone #small-user-nav-div .btn,
body.android #small-user-nav-div .btn
{
    font-size: 22px;
}

body.iphone #small-user-nav-div > div,
body.android #small-user-nav-div > div
{
    width: 100% !important;
}

body.iphone #user_admin_content .dropdown-menu > li > a,
body.iphone #small-user-nav-div .dropdown-menu > li > a,
body.android #user_admin_content .dropdown-menu > li > a,
body.android #small-user-nav-div .dropdown-menu > li > a
{
    font-size: 200%;
    line-height: 1.5;
}

body.iphone #user_admin_content .dropdown-menu > li.dropdown-header,
body.android #user_admin_content .dropdown-menu > li.dropdown-header
{
    font-size: 170%;
    line-height: 1.3;
}

.panel-title
{
    font-size: 200%;
}

#showthumbnails
{
    margin-right: 30px;
}

#superuseradmin
{
    display: none;
}

body.superuser #superuseradmin
{
    display: inline-block;
}

#superuser_cancelled, #superuser_blocked, #cancelled, #blocked
{
    width: 100%;
    padding: 50px;
}

body.iphone #superuseradmin,
body.iphone #superuseradmin > i
{
    margin-top: 5px;
}

.dd
{
    display: inline-block;
    position: relative;
}

body.pc .dd > button, body.pc div.controls #addroom, body.pc div.controls .addfree
{
    padding-top: 4px !important;
}

body:not(.pc) div.controls #addroom, body:not(.pc) div.controls .addfree
{
    margin-top: -10px;
}

.sub-check
{
    display: none;
    float: right;
}

#licenses:after
{
    display: none;
}

#licenses .nav-icon,
#userLoginAccount > a > .nav-icon
{
    margin-top: 3px;
}

    #licenses .nav-icon i.fa-person-shelter
    {
        font-size: 18px;
    }

body.iphone #licenses .nav-icon,
body.iphone #userLoginAccount > a > .nav-icon
{
    margin-top: 2px;
}

#licensesdiv li > a > .sub-company
{
    display: inline-block;
    /*max-width: 90%;*/
    overflow: hidden;
    text-overflow: ellipsis;
}


#licensesdiv ul.dropdown-menu.inner > li,
#licensesdiv ul.dropdown-menu.inner > li > a
{
    outline: none !important;
    /*width: 210px;*/
    overflow: hidden;
    text-overflow: ellipsis;
}

#licenses-dropdown li > a.selected
{
    background-color: #eee;
}

#btnLangToggle span.flag
{
    vertical-align: middle;
}

#teamrooms-wrapper
{
    height: calc(var(--vh100, 100vh) - 176px);
    overflow-y: auto;
}

.teamroom-panel
{
    width: 280px;
    min-width: 280px;
    height: calc(var(--vh100, 100vh) - 89px);
    background: #414240;
    color: #ddd;
    position: relative;
}

body.iphone .teamroom-panel,
body.android .teamroom-panel
{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    width: 100%;
    visibility: hidden;
    opacity: 0;
    transition: opacity .7s linear;
}

    body.iphone .teamroom-panel.reveal,
    body.android .teamroom-panel.reveal
    {
        visibility: visible;
        opacity: 1;
    }

.teamroom-title
{
    height: 44px;
    width: 100%;
    border-bottom: 1px solid #ddd;
    display: flex;
    align-items: center;
    background: #414240;
    color: #ddd;
}

    .teamroom-title > .title
    {
        font-weight: bold;
        font-size: 120%;
        padding-left: 15px;
    }

#teamroomsdiv
{
    /*background: #fdfffb;*/
}

body.iphone #teamrooms,
body.android #teamrooms
{
    font-size: 24px;
}

#teamrooms > div
{
    position: relative;
    display: flex;
    align-items: center;
    padding: 5px 15px;
    margin-bottom: 10px;
    /*background-color: #fff;*/
    cursor: pointer;
    justify-content: space-between;
}

    #teamrooms > div:hover
    {
        background: #f2f3f1;
        color: #333;
    }

    #teamrooms > div:first-child
    {
        margin-top: 10px;
    }

    #teamrooms > div[data-selected='true']
    {
        background: #eeffee;
        color: #333;
        cursor: default;
    }

    #teamrooms > div > div
    {
        display: inline-block;
        white-space: nowrap;
    }

        #teamrooms > div > div.tr-name
        {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            padding-right: 30px;
            flex: 1 1 auto !important;
        }

        #teamrooms > div > div.tr-admin
        {
            padding: 0 8px;
            position: absolute;
            right: 0;
            color: #696969;
            cursor: default;
        }

    #teamrooms > div:not([data-selected='true']):hover > div.tr-admin
    {
        display: none;
    }

    #teamrooms > div[data-selected='true'] > div.tr-admin
    {
        color: #333;
        cursor: pointer;
    }

        #teamrooms > div[data-selected='true'] > div.tr-admin:hover
        {
            color: #73bb75;
        }

.teamroom-new
{
    position: absolute;
    bottom: 0px;
    width: 100%;
    z-index: 2;
    height: 43px;
    border-top: 1px solid #ccc;
    display: flex;
    align-items: center;
    background: #414240;
    padding-left: 15px;
    padding-right: 15px;
    color: #ddd;
}

    .teamroom-new > div
    {
        cursor: pointer;
    }

        .teamroom-new > div > .newteam-text
        {
            margin-left: 10px;
        }

        .teamroom-new > div:hover > .newteam-text
        {
            text-decoration: underline;
        }

        .teamroom-new > div > *
        {
            display: inline-block;
            vertical-align: middle;
        }

        .teamroom-new > div > i
        {
            transform: scale(0.7);
            color: #bbb;
        }

            .teamroom-new > div > i:nth-child(2)
            {
                margin-top: -10px;
                margin-left: -5px;
                color: #73bb75;
            }


#user-nav.nav-tabs > li > a,
#examples-sub-nav.nav-tabs > li > a
{
    border: none;
    border-radius: 0;
    border-bottom-color: transparent;
    border-bottom-width: 4px;
    color: #464844;
    margin-top: 0px;
}

    #user-nav.nav-tabs > li > a.active,
    #user-nav.nav-tabs > li > a.active:focus,
    #user-nav.nav-tabs > li > a.active:hover
    {
        border: none;
        border-bottom-width: 4px;
        border-bottom-style: solid;
        border-bottom-color: #73bb75;
        color: #28712a;
        cursor: default;
        background-color: transparent;
        font-weight: bold;
    }

    #user-nav.nav-tabs > li > a:hover
    {
        border-bottom-color: rgba(115, 187, 117,.6);
        box-shadow: none;
    }

#examples-sub-nav.nav-tabs > li.active > a,
#examples-sub-nav.nav-tabs > li.active > a:focus,
#examples-sub-nav.nav-tabs > li.active > a:hover
{
    border: none;
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-bottom-color: #737bbb;
    color: #283e71;
    cursor: default;
    background-color: transparent;
    font-weight: bold;
}

#examples-sub-nav.nav-tabs > li > a:hover
{
    border-bottom-color: rgba(115, 132, 187, 0,60);
    box-shadow: none;
}

/*body.iphone #licensesdiv > div.btn-group.bootstrap-select, body.android #licensesdiv > div.btn-group.bootstrap-select,
body.iphone #teamroomsdiv > div.btn-group.bootstrap-select, body.android #teamroomsdiv > div.btn-group.bootstrap-select
{
    width: 200px !important;
}*/
#selector_controls
{
    display: block;
    width: 100%;
    margin-top: -10px;
}

    #selector_controls .controls
    {
        display: inline-block;
        margin-top: 10px;
    }

        #selector_controls .controls:nth-child(2)
        {
            display: block;
        }

@media (min-width: 949px)
{
    #selector_controls .controls:nth-child(2)
    {
        display: inline-block;
        margin-left: 40px;
    }
}


#dummy
{
    display: none;
}

/*body:not(.pc)*/ #dummy
{
    display: inline-block;
    float: right;
    min-width: 300px;
    min-height: 50px;
}

body.iphone #dummy,
body.android #dummy
{
    min-height: 65px;
}

body.pc #dummy
{
    min-width: 370px;
}

/*body:not(.pc)*/ #button_controls
{
    position: absolute;
    float: right;
    right: 15px;
    bottom: 9px;
}

/*body:not(.pc)*/ #user_admin_content
{
    padding-bottom: 0px;
}

body.iphone #selector_controls .controls:nth-child(2),
body.android #selector_controls .controls:nth-child(2) /*, body.ipad #selector_controls .controls:nth-child(2)*/
{
    float: right;
    margin-left: 0px;
}

body.iphone #selector_controls .controls > span,
body.android #selector_controls .controls > span /*, body.ipad #selector_controls .controls > span*/
{
    display: block;
    margin-bottom: 5px;
    font-size: 14px;
}

body.iphone #selector_controls .controls .btn-group,
body.android #selector_controls .controls .btn-group,
body.ipad #selector_controls .controls .btn-group
{
    width: 230px !important;
    margin-bottom: 10px;
}

@media (max-width: 768px)
{
    body.ipad #selector_controls .controls:nth-child(2)
    {
        display: inline-block;
        margin-left: 35px;
    }

    body.ipad #selector_controls .controls .btn-group
    {
        width: 220px !important;
        margin-bottom: 10px;
    }
}

/*body.ipad #selector_controls .controls .btn-group
{
    margin-bottom: 10px;
}*/

body.iphone .nomobile,
body.android .nomobile
{
    display: none;
}

.radargroup-title
{
    margin-top: 24px;
    margin-bottom: 0;
    font-weight: bold;
}

#radars, #archive_radars, #subscribed, #extra, #published_radars, #template_radars
{
    margin-top: 24px;
    padding-left: 10px;
    padding-right: 10px;
}

#user-nav-content .shelves > ul
{
    margin-top: 24px;
    padding-left: 10px;
    padding-right: 10px;
}

.footer
{
    font-size: 1.4em;
}

.item-row
{
    /*padding-left: 10px;*/
}

.radardisplay-wrapper
{
    padding-left: 15px !important;
    padding-right: 15px !important;
    font-size: 10px;
}

body.ipad .radardisplay-wrapper
{
    padding-left: 10px !important;
    padding-right: 10px !important;
    font-size: 9px;
}

.radardisplay-title
{
    overflow: hidden;
    text-overflow: ellipsis;
}

#no_subscription, #cancelled, #overtime, #pend, #no_teamroom
{
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px;
    width: 100%;
}

.trial
{
    color: #999 !important;
    cursor: no-drop !important;
}

#sven label
{
    padding-bottom: 7px;
    background-color: transparent !important;
}

    #sven label.flag
    {
        padding-bottom: 3px;
        padding-top: 9px;
    }

body[data-sven='en'] #subscription_content li[data-sven='sv']
{
    display: none !important;
}

body[data-sven='sv'] #subscription_content li[data-sven='en']
{
    display: none !important;
}

.img-full
{
    width: 100%;
    padding-left: 2%;
    padding-right: 2%;
}

.img-text
{
    color: #555;
    /*position: absolute;*/
    /*right: 10%;
    bottom: 10%;*/
    font-size: 2.2vw;
    max-width: 80%;
}

@media (orientation: portrait)
{
    .img-text
    {
        font-size: 5.2vw;
    }
}

.img-text2
{
    color: #555;
    /*position: absolute;
    right: 10%;
    bottom: 10%;*/
    font-size: 1.7vw;
    max-width: 80%;
}

.img-btn
{
    color: #555 !important;
    border: 2px solid #555;
    border-radius: 2vw;
    padding: 0vw 1.5vw;
    margin-top: 2vh;
    display: inline-block;
    text-decoration: none !important;
}

    .img-btn:hover
    {
        color: #000 !important;
        border: 2px solid #000;
        background-color: #eee;
        text-decoration: none !important;
    }

.welcome-block
{
    margin-bottom: 20px;
    background-color: #fff;
    padding: 35px 15px;
}

body[data-displaymode='imagegrid'] #radars > li.noradars,
body[data-displaymode='imagegrid'] #archive_radars > li.noradars,
body[data-displaymode='imagegrid'] #published_radars > li.noradars,
body[data-displaymode='imagegrid'] #extra > li.noradars,
body[data-displaymode='imagegrid'] #template_radars > li.noradars,
body[data-displaymode='imagegrid'] #images_library_images > li.noradars
{
    width: calc(100% - 60px) !important;
    max-width: calc(100% - 60px) !important;
}

li.noradars .lead
{
    margin-top: 20px;
}

@media (min-width: 880px)
{
    .img-text
    {
        font-size: 4vw;
    }
}

@media (min-width: 992px)
{
    .img-text
    {
        font-size: 1.7vw;
    }
}

@media (min-width: 1120px)
{
    .img-text
    {
        font-size: 1.4vw;
    }
}

@media (min-width: 1288px)
{
    .img-text
    {
        font-size: 1.45vw;
    }
}

.animate-highlight
{
    background-color: #88c9f5;
}

.animate-btn-highlight
{
    background-color: #88c9f5;
    transform: scale(1.2);
    margin-right: 5px;
}

li.separator
{
    border-bottom: 1px solid #ccc;
    margin-top: 2px;
    margin-bottom: 2px;
}

#instantField
{
    z-index: 2000;
    color: #777;
    position: absolute;
    top: 60px;
    left: 50%;
    opacity: 1;
    transition: opacity 4s;
}

#instantMsg
{
    position: relative;
    left: -50%;
}

#dlgSelectTeam .modal-title
{
    display: none;
}

#dlgSelectTeam.copy .modal-title.copy
{
    display: block;
}

#dlgSelectTeam.move .modal-title.move
{
    display: block;
}

#dlgSelectTeam .movecopy-hint
{
    display: none;
}

#dlgSelectTeam.copy .movecopy-hint.copy
{
    display: block;
}

#dlgSelectTeam.move .movecopy-hint.move
{
    display: block;
}

/*#a_shelves, #e_shelves, #f_shelves
{
    position: relative;
}*/

.tabs-buttons
{
    display: flex;
    flex-direction: row;
}

#flags
{
    display: none;
    margin-right: 15px;
}

    #flags > div
    {
        margin-right: 5px;
    }

        #flags > div:nth-child(2)
        {
            height: 38px;
        }

#subscription_content.active.in ~ #displaymode-wrapper > #flags
{
    display: flex;
    flex-direction: row;
}

.icon-text2
{
    display: block;
    font-size: 12px;
}

#btnHelp, #btnLangToggle, #superuseradmin
{
    transform: none !important;
}

    #btnHelp i, #superuseradmin i, #btnSearch i
    {
        font-size: 18px;
    }

    #btnLangToggle > span
    {
        white-space: nowrap;
    }

body.iphone #btnSearch .icon-text2
{
    margin-top: 4px;
}

/*#newdropdown
{
    display: none;
    font-size: 15px;
    color: #333;
}

body.admin #user_content.active.in ~ #displaymode-wrapper #newdropdown
{
    display: inline-block;
}*/
/*#newdropdown
{
    display: none;
    font-size: 15px;
    color: #333;
}

body.admin #user_content.active.in ~ #displaymode-wrapper #newdropdown
{
    display: inline-block;
}*/
/*#displaymode-wrapper .icon-text
{
    color: #333;
}

#displaymode-wrapper
{
    width: calc(100vw - 295px);
    text-align: right;
    padding: 5px 15px;
    position: fixed;
    right: 15px;
    z-index: 1;
    background: rgba(242,243,241,0.97);
    top: 98px;
    display: none;
    flex-direction: row;
    justify-content: flex-end;
    background: rgba(37,36,35,.05);
    border-bottom: 1px solid #ddd;
    height: 44px;
}

body.admin #user_content.active.in ~ #displaymode-wrapper
{
    display: flex;
}


body.ipad #displaymode-wrapper
{
    width: calc(100vw - 292px);
    padding: 5px 15px;
    top: 97px;
    right: 5px;
}*/
#welcome_content > div
{
    margin-top: 40px;
}

@media (min-width: 1300px)
{
    #displaymode-wrapper
    {
        text-align: right;
        margin-top: -94px;
        margin-right: 10px;
        position: absolute;
        right: 0;
        width: auto;
        background: transparent;
        padding: 0;
        border: 0;
    }

    .shelves, #welcome_content > div
    {
        margin-top: 0px;
    }
}

#user-wrapper .newradar-tab
{
    display: none !important;
    color: #333;
    position: absolute;
    right: 0;
}

body.admin #user-wrapper[data-tab='#user_content'] .newradar-tab,
body.admin #user-wrapper[data-tab='#welcome_content'] .newradar-tab
{
    display: flex !important;
}

#newradar-wrapper
{
    margin-right: 30px;
    /*margin-top: 4px;*/
    padding: 10px 15px;
}

    #newradar-wrapper > #newdropdown
    {
        color: #333 !important;
        margin-top: 2px;
        margin-bottom: -2px;
    }

    #newradar-wrapper.open > #newdropdown > span
    {
        text-decoration: underline;
        color: #28712a;
    }

#show-users:hover span
{
    text-decoration: underline;
}

#newradarmenu
{
    max-height: 300px;
    overflow-y: auto;
    /*top: 30px;*/
    right: -15px;
}

    #newradarmenu .dropdown-header
    {
        color: #05208a;
        pointer-events: none;
    }

#newdropdown
{
    cursor: pointer;
    height: 25px;
}

    #newdropdown:hover > span
    {
        text-decoration: underline;
    }

    #newdropdown > i
    {
        color: #28712a;
    }

#errorRow
{
    background-color: #333;
    margin-top: -1px;
    cursor: pointer;
}

#errorField
{
    margin-top: 24px;
}

#small-navs
{
    width: 100%;
    border-bottom: 1px solid #ccc;
    display: flex;
    justify-content: space-between;
}

#small-user-nav-div,
#small-examples-sub-nav
{
    height: 44px;
    align-items: center;
    display: flex;
}

    #small-user-nav-div > div.dropdown-menu,
    #small-examples-sub-nav > div.dropdown-menu
    {
        width: 250px !important;
    }

    #small-user-nav-div > div > button,
    #small-examples-sub-nav > div > button
    {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        color: #333;
        outline: none !important;
        font-size: 14px;
        width: auto !important;
    }

        #small-user-nav-div > div > button > span:first-child,
        #small-examples-sub-nav > div > button > span:first-child
        {
            margin-right: 10px;
        }

#small-navs ul > li > a
{
    outline: none !important;
}

#small-examples-sub-nav > div.bootstrap-select
{
    display: flex;
    justify-content: end;
}

.addfree
{
    display: none;
}

body:not(.hasfree) .addfree
{
    display: inline-block;
}

#copyToSub
{
    display: none;
}

#dlgSelectTeam.copy #copyToSub
{
    display: block;
}

.radio-btn
{
    display: inline-block;
    text-align: center;
    border-bottom-width: 4px;
    border-bottom-style: solid;
    border-bottom-color: transparent;
    height: 48px;
    cursor: pointer;
}

    .radio-btn:hover > i
    {
        color: #28712a;
    }

    .radio-btn > input
    {
        position: absolute;
        clip: rect(0,0,0,0);
        pointer-events: none;
    }

    .radio-btn.active, .radio-btn.active:focus, .radio-btn.active:hover
    {
        border: none;
        border-bottom-width: 4px;
        border-bottom-style: solid;
        border-bottom-color: #73bb75;
        color: #28712a;
        cursor: default;
        background-color: transparent;
    }


#zoom
{
    position: absolute;
    right: 30px;
    bottom: 0px;
    height: 40px;
    color: #ddd;
    z-index: 3050;
    font-size: 10px;
    display: none;
}

    #zoom .slider.slider-horizontal
    {
        margin-top: -2px;
    }

        #zoom .slider.slider-horizontal .slider-track
        {
            height: 4px;
            margin-top: -2px;
        }

    #zoom .slider-track-low, #zoom .slider-track-high, #zoom .slider-selection
    {
        background: #848484;
    }

    #zoom .slider.slider-horizontal .slider-tick, #zoom .slider.slider-horizontal .slider-handle
    {
        margin-left: -10px;
    }

    #zoom .slider-handle
    {
        background: none;
        content: url("/images/handle.png");
        width: 20px;
        height: 20px;
    }

    #zoom .slider-plus, #zoom .slider.slider-horizontal, #zoom .slider-data
    {
        margin-left: 10px;
    }

    #zoom .slider-plus, #zoom .slider-minus
    {
        height: 100%;
        display: inline-block;
        padding: 14px 5px;
        cursor: pointer;
    }

        #zoom .slider-plus:hover, #zoom .slider-minus:hover
        {
            background-color: #777;
        }

body[data-roomid] #zoom
{
    display: block;
}

.radarpanel-leadtext
{
    padding-left: 45px;
    padding-top: 15px;
    font-size: 120%;
}

#dlgRestorePoints .btn
{
    padding: 2px 9px;
    border-radius: 0px;
    font-size: 12px;
    outline: none !important;
}

#orderedRPs, #automaticRPs
{
    max-height: 30vh;
    overflow-y: scroll;
}

#dlgRestorePoints
{
    z-index: 1200 !important;
}

    #dlgRestorePoints .list-group-item
    {
        padding: 3px 15px 3px 15px !important;
        border-radius: 0px;
        background-color: #f6f8f6;
    }

    #dlgRestorePoints button
    {
        margin-left: 10px;
    }

    #dlgRestorePoints .btn-danger
    {
        background-color: #595959;
        border-color: #595959;
        color: #ddd;
    }

        #dlgRestorePoints .btn-danger:hover
        {
            background-color: #818181;
            border-color: #818181;
            color: #ddd;
        }

    #dlgRestorePoints .btn-success
    {
        background-color: #4c894d;
        border-color: #4c894d;
        color: #ddd;
    }

        #dlgRestorePoints .btn-success:hover
        {
            background-color: #77ad78;
            border-color: #77ad78;
            color: #ddd;
        }

    #dlgRestorePoints .btn-primary
    {
        background-color: #14417f;
        border-color: #14417f;
        color: #ddd;
    }

        #dlgRestorePoints .btn-primary:hover
        {
            background-color: #3c6bac;
            border-color: #3c6bac;
            color: #ddd;
        }

    #dlgRestorePoints .modal-title
    {
        display: inline-block !important;
    }

    #dlgRestorePoints .popup-close
    {
        float: right;
        width: 30px;
        display: inline-block;
        cursor: pointer;
        text-align: center;
        margin-left: 5px;
        font-size: 150%;
    }

#versions-error
{
    cursor: pointer;
}

body:not(.ipad) #dlgRestorePoints .popup-close:hover
{
    background-color: rgba(255,255,255,0.5);
}

#userLogTab > tr > td:first-child
{
    width: 135px;
}

#userLogTab > tr > td:last-child
{
    display: flex;
}

    #userLogTab > tr > td:last-child > button
    {
        align-self: baseline;
        margin-left: 10px;
    }

    #userLogTab > tr > td:last-child > div
    {
        flex: 1;
    }

#examples-nav-content
{
    padding-top: 24px;
}

    #examples-nav-content > div
    {
        display: none;
    }

        #examples-nav-content > div.active
        {
            display: block;
        }

#createRadarThumb
{
    aspect-ratio: 16 / 9;
}

.example-content
{
    display: none;
    height: 336px;
    min-height: 336px;
    padding: 8px;
}

.ex-main[data-ex='ex1'] .example-content[data-ex='ex1']
{
    display: block;
}

.ex-main[data-ex='ex2'] .example-content[data-ex='ex2']
{
    display: block;
}

.ex-main[data-ex='ex3'] .example-content[data-ex='ex3']
{
    display: block;
}

.ex-main[data-ex='ex4'] .example-content[data-ex='ex4']
{
    display: block;
}

.ex-main[data-ex='ex5'] .example-content[data-ex='ex5']
{
    display: block;
}

.ex-main[data-ex='ex6'] .example-content[data-ex='ex6']
{
    display: block;
}

.ex-main[data-ex='ex7'] .example-content[data-ex='ex7']
{
    display: block;
}

#ex-selector
{
    display: flex;
    justify-content: flex-start;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 15px;
    padding-top: 15px;
}

    #ex-selector > li
    {
        margin-right: 15px;
    }

@media (min-width: 1200px)
{
    #ex-selector
    {
        display: flex;
        justify-content: space-between;
        /*margin-left: -58px;
        margin-right: -58px;*/
    }

        #ex-selector > li
        {
            margin-right: 0px;
        }
}

.nav-pills > li > a
{
    font-size: 120%;
    color: #333;
    background-color: #eee;
    border-radius: 8px;
}

    .nav-pills > li > a:hover
    {
        color: #fff;
        background-color: #999;
    }

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover
{
    color: #fff !important;
    background-color: rgba(109, 177, 111, 0.87) !important;
}

.headline-wrapper
{
    background-blend-mode: normal, normal;
    color: rgb(255, 255, 255);
    font-size: 170%;
    min-height: 600px;
}

    .headline-wrapper .col-md-6
    {
        margin-top: 30px;
    }

    .headline-wrapper h1
    {
        font-size: 55px;
    }

@media (max-width: 991px)
{
    .headline-wrapper
    {
        background: url("/images/headline-bg-small.svg") center bottom -0.5px / 100% 14% no-repeat scroll padding-box border-box, linear-gradient(60deg, rgb(36 82 32), rgb(80 237 107)) 0% 0% / auto repeat scroll padding-box border-box rgb(36 82 32);
    }
}

@media (min-width: 992px)
{
    .headline-wrapper
    {
        background: url("/images/headline-bg.svg") center bottom -0.5px / 100% 14% no-repeat scroll padding-box border-box, linear-gradient(60deg, rgb(36 82 32), rgb(80 237 107)) 0% 0% / auto repeat scroll padding-box border-box rgb(36 82 32);
    }
}

@media (min-width: 992px) and (max-width: 1199px)
{
    .headline-wrapper
    {
        font-size: 130%;
    }
}

.ex-heading
{
    margin-top: 40px;
}

#nav-scroller
{
    width: 100%;
    overflow: hidden;
    scroll-behavior: smooth;
}

#nav-scroller-wrapper
{
    width: 100%;
    position: relative;
}

    #nav-scroller-wrapper button.scroll-button
    {
        position: absolute;
        top: 0;
        z-index: 10;
        opacity: 0.5;
        margin-top: 6px;
    }

        #nav-scroller-wrapper button.scroll-button:hover
        {
            opacity: 0.7;
        }

    #nav-scroller-wrapper button.scroll-button-right
    {
        right: -10px;
    }

    #nav-scroller-wrapper button.scroll-button-left
    {
        left: -10px;
    }

    #nav-scroller-wrapper button.scroll-button-right,
    #nav-scroller-wrapper button.scroll-button-left
    {
        display: none;
    }

@media (max-width: 991px)
{
    #nav-scroller-wrapper.left-view button.scroll-button-right
    {
        display: block;
    }

    #nav-scroller-wrapper.right-view button.scroll-button-left
    {
        display: block;
    }
}


/*ANpassning till senare versioner nav bootstrap
Kan tas bort när de är implementerade*/

@media (min-width: 992px)
{
    .d-md-flex
    {
        display: flex !important;
    }
}

.align-items-end
{
    align-items: end;
}

.align-items-center
{
    align-items: center;
}

.btn-flip
{
    /*opacity: 1;
    outline: 0;
    color: #fff;
    line-height: 40px;*/
    position: relative;
    width: 300px;
    height: 50px;
    /*text-align: center;
    letter-spacing: 1px;
    display: inline-block;
    text-decoration: none;
    font-family: "Open Sans";
    text-transform: uppercase;*/
}

    .btn-flip:hover:after
    {
        opacity: 1;
        transform: translateY(0) rotateX(0);
    }

    .btn-flip:hover:before
    {
        opacity: 0;
        transform: translateY(50%) rotateX(90deg);
    }

    .btn-flip:after
    {
        top: 10px;
        left: 0;
        opacity: 0;
        display: block;
        transition: 0.5s;
        position: absolute;
        background: #157347;
        content: attr(data-back);
        transform: translateY(-50%) rotateX(90deg);
        width: 298px;
    }

    .btn-flip:before
    {
        top: 10px;
        left: 0;
        opacity: 1;
        display: block;
        transition: 0.5s;
        position: absolute;
        background: #198754;
        content: attr(data-front);
        transform: translateY(0) rotateX(0);
        width: 298px;
    }

.modal-almost-fullscreen
{
    width: 94vmin !important;
    min-width: 500px;
    max-width: none;
}

.teamroom-selector .btn-teamroom-action
{
    color: #929491;
    border: 0;
    background: transparent;
    height: 29px;
    margin-top: -5.5px;
    margin-bottom: -5.5px;
}

    .teamroom-selector .btn-teamroom-action:hover
    {
        color: #6c6a6a !important;
        background-color: #b5b7b4;
    }

.teamroom-selector[data-selected='true'] .btn-teamroom-action
{
    color: #788278;
}

    .teamroom-selector[data-selected='true'] .btn-teamroom-action:hover
    {
        color: #406840 !important;
        background-color: #c6d6c6;
    }

#teamroom-actions-bg
{
    position: absolute;
    z-index: 4999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0);
    display: none;
}

#teamroom-actions
{
    position: absolute;
    z-index: 5000;
    top: 100px;
    left: 180px;
    padding: 8px 0;
    background-color: #eee;
    border: 1px solid #bbb;
    border-radius: 8px;
    border-top-left-radius: 0px;
}

    #teamroom-actions.show + #teamroom-actions-bg,
    #teamroom-actions.collapsing + #teamroom-actions-bg
    {
        display: block;
    }

    #teamroom-actions.br-dropup
    {
        border-top-left-radius: 8px;
        border-bottom-left-radius: 0px;
    }

    #teamroom-actions > ul
    {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        #teamroom-actions > ul > li
        {
            padding: 2px 8px;
        }

            #teamroom-actions > ul > li:hover
            {
                background-color: #ccc;
            }

            #teamroom-actions > ul > li > i
            {
                width: 24px;
                text-align: start;
            }

.teamroom-selector.actionable
{
    background: #f2f3f1;
    color: #333;
}

#dlgRestorePoints .modal-dialog
{
    max-width: 900px;
}

#dlgSearch
{
    top: 50px;
    height: calc(100vh - 90px);
}

    #dlgSearch .modal-body
    {
        padding: 0px 15px !important;
    }

        #dlgSearch .modal-body > .search-splash
        {
            margin-left: -15px;
            height: 100%;
            width: 100%;
            position: absolute;
            z-index: 1;
            background-color: #edeff6;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

    #dlgSearch .close-search
    {
        float: right;
        width: 30px;
        display: inline-block;
        cursor: pointer;
        text-align: center;
        margin-left: 5px;
        font-size: 14px;
    }

    #dlgSearch .close-search:hover
    {
        background-color: #ddd;
        color: #555;
    }

    #dlgSearch table.table.dataTable > :not(caption) > * > *
    {
        vertical-align: middle;
    }

.search-description
{
    width: 20%;
}

#searchRadarTable_wrapper > div:first-child
{
    position: sticky;
    top: 0;
}

    #searchRadarTable_wrapper > div:first-child input[type='search']
    {
        background-color: #ffffffbb;
    }

#searchRadarTable_wrapper .dt-scroll-body
{
    max-height: calc(100vh - 235px) !important;
    min-height: calc(100vh - 235px) !important;
}

#dlgSearchHelp .modal-body
{
}

#dlgSearchHelp .search-help-label
{
    font-weight: bold;
}

#dlgSearchHelp .search-help-text
{
}

#searchRadarTableBody button:after
{
    display: none !important;
}

#searchRadarTableBody .dropdown-menu > li > a
{
    font-size: 12px;
    line-height: 1;
}

#searchRadarTableBody .foradmin
{
    display: none;
}

    #searchRadarTableBody .foradmin[data-userrole='admin']
    {
        display: block;
    }

#searchRadarTableBody [data-type='radar'][data-storage='publish'],
#searchRadarTableBody [data-type='published'][data-storage='normal'],
#searchRadarTableBody [data-type='published'][data-storage='archive']
{
    display: none;
}

#searchRadarTableBody tr
{
    cursor: pointer;
}

    #searchRadarTableBody tr:not(.r-selected):hover > *
    {
        background-color: #eee !important;
    }

    #searchRadarTableBody tr.r-selected:hover > *
    {
        background-color: #fffbcd !important;
    }

    #searchRadarTableBody tr.r-selected > td
    {
        background-color: #fffde5;
    }

#dlgSearch.multiple tr.r-selected > td button.dropdown-toggle
{
    opacity: 0;
    pointer-events: none;
}

#dlgSearch tr > td button.dropdown-toggle:before
{
    display: none;
}

#dlgSearch tr ul.dropdown-menu
{
    margin-right: 47px !important;
}

#searchRadarsHammerWrapper
{
    position: absolute;
    top: 9px;
    right: 190px;
    display: none;
    z-index: 3;
}

#btnSearchRadarsHammer
{
    background-color: #fffde5;
}

    #btnSearchRadarsHammer:hover
    {
        background-color: #6c757d;
    }

    #btnSearchRadarsHammer.show:not(:hover)
    {
        color: #777;
    }

#multipleSearchRadarsActions li > a[data-inactive='true']
{
    opacity: 0.5;
    pointer-events: none;
}


#dlgSearch.multiple #searchRadarsHammerWrapper
{
    display: block;
}

#searchProcessProgress
{
    padding: 5px;
    border: 1px solid #ddd;
}

    #searchProcessProgress > div
    {
        height: 8px;
        background-color: darkgreen;
    }

        #searchProcessProgress > div:first-child
        {
            font-weight: bold;
            transition: width linear 1s;
        }


#dlgSearchProgress div.obscurer
{
    position: absolute;
    top: 20px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    background: linear-gradient(-180deg, #d8dcd84c 0%, #d8dcd8ff 90%);
}

#dlgSearchProgress .terminate-pending
{
    opacity: 0;
}

    #dlgSearchProgress.terminate-pending .terminate-pending
    {
        opacity: 1;
    }

    #dlgSearchProgress.terminate-pending #btnCancelSearchProcess
    {
        pointer-events: none;
        opacity: 0.5;
    }

#searchProcessCurrentRadar
{
    max-height: 600px;
    overflow: hidden;
}


#mediaMagnifySize, #mediaShowWeb
{
    width: 30px;
    cursor: pointer;
    text-align: center;
}

#mediaMagnify[data-type='image']:not(.is-fullscreen) .modal-body
{
    max-height: initial !important;
    height: calc(var(--vh100) - 105px) !important;
}

#mediaMagnify .modal-title
{
    width: auto !important;
}

#mediaMagnify .modal-body
{
    overflow-y: auto;
    text-align: center;
}

#images_library_images li.selected
{
    outline: 2px yellow solid;
}

#dlgImgSelectTeam .modal-title
{
    display: none;
}

#dlgImgSelectTeam.copy .modal-title.copy
{
    display: block;
}

#dlgImgSelectTeam.move .modal-title.move
{
    display: block;
}

#dlgImgSelectTeam .movecopy-hint
{
    display: none;
}

#dlgImgSelectTeam.copy .movecopy-hint.copy
{
    display: block;
}

#dlgImgSelectTeam.move .movecopy-hint.move
{
    display: block;
}

#dlgImgSelectTeam .warning
{
    display: none;
}

#dlgImgSelectTeam.move .warning.move
{
    display: block;
}