﻿/*-------------------------------------------------*/
/*----------------------Colors---------------------*/
/*-------------------------------------------------*/

.txRed {
    background-color: #e53935;
    color: white;
}

.txYellow {
    background-color: #f5e79e;
    color: #404040;
}

.txBlue {
    background-color: #0069b4;
    color: #404040;
}

.txGreen {
    background-color: #33b679;
    color: #404040;
}

/*-------------------------------------------------*/
/*----------------------Common---------------------*/
/*-------------------------------------------------*/

#idDivPortal {
    width: 100%;
    height: 100%;
    overflow: auto;
    overflow-x: hidden;
}

    #idDivPortal [data-object-tag], #idDivPortal [data-object-type-tag], #idDivPortal [data-model-application-tag], #idDivPortal [data-requirement-list-tag], #idDivPortal [data-choice-guide-tag],
    #idDivPortal [data-advanced-creation-tag], #idDivPortal [data-business-view-tag], #idDivPortal [data-exportation-ot-tag], #idDivPortal [data-url] {
        cursor: pointer;
    }

.clFloatLeft {
    float: left;
}

.clFloatRight {
    float: right;
}

/*-------------------------------------------------*/
/*------------------TxSpecification----------------*/
/*-------------------------------------------------*/

.clPortalTxSpecification {
    width: 100%;
    height: 100%;
}

/*-------------------------------------------------*/
/*----------------------Butons---------------------*/
/*-------------------------------------------------*/

.clPortalButton {
    text-align: center;
    border: 0px;
    height: 2.5em;
    width: calc(100% - 14px);
    font-size: 20px;
    transition: all 0.2s;
    margin: 6px;
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    vertical-align: top;
    background: linear-gradient(rgba(255,255,255,1), rgba(197,188,210,0.1), rgba(197,188,210,0.3), rgba(197,188,210, 0.6));
    color: #404040;
    transform: scale(1);
    -moz-box-shadow: 0px 0px 3px 0px #343434;
    -webkit-box-shadow: 0px 0px 3px 0px #343434;
    -o-box-shadow: 0px 0px 3px 0px #343434;
    box-shadow: 0px 0px 3px 0px #343434;
}

.clPortalButton:hover {
    transform: scale(1.02);
    -ms-transform: scale(1.02);
    -moz-box-shadow: 0px 0px 5px 0px #343434;
    -webkit-box-shadow: 0px 0px 5px 0px #343434;
    -o-box-shadow: 0px 0px 5px 0px #343434;
    box-shadow: 0px 0px 5px 0px #343434;
}

.clPortalButton:active {
    transform: scale(0.99);
    -ms-transform: scale(0.99);
    transition: all 0.1s;
    -moz-box-shadow: inset 0px 0px 5px 0px #343434;
    -webkit-box-shadow: inset 0px 0px 5px 0px #343434;
    -o-box-shadow: inset 0px 0px 5px 0px #343434;
    box-shadow: inset 0px 0px 5px 0px #343434;
}

.clPortalButton:focus {
    outline: none;
}

.clPortalButtonIcon::before {
    margin-right: 0.5em;
    font-size: 1.2em;
}

.clPortalButtonSquare {
    height: 8em;
    white-space: normal;
}

.clPortalButton > objectscounter {
    float: right;
    position: absolute;
    margin-left: 16px;
}

/*-------------------------------------------------*/
/*-------------------Quick search------------------*/
/*-------------------------------------------------*/

.clPortalQuickSearchInput {
    height: 24px;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 6px;
    padding-right: 6px;
    width: 200px;
    border: none;
    border-radius: 8px;
    transform: scale(1);
    transition: all 0.2s;
    -moz-box-shadow: 0px 0px 3px 0px #343434;
    -webkit-box-shadow: 0px 0px 3px 0px #343434;
    -o-box-shadow: 0px 0px 3px 0px #343434;
    box-shadow: 0px 0px 3px 0px #343434;
}

.clPortalQuickSearchInput:focus {
    transform: scale(1.02);
    -ms-transform: scale(1.02);
    border: none !important; /* To overload the rule from native TEEXMA inputs */
}

.clPortalQuickSearchInput {
    outline: none;
}

.clPortalQuickSearchResultsContainer {
    position: absolute;
    z-index: 20;
    overflow-y: auto;
    overflow-x: hidden;
    text-overflow: ellipsis;
    background-color: white;
    border-radius: 6px;
    display: none;
    -moz-box-shadow: 1px 1px 5px 1px #343434;
    -webkit-box-shadow: 1px 1px 5px 1px #343434;
    -o-box-shadow: 1px 1px 5px 1px #343434;
    box-shadow: 1px 1px 5px 1px #343434;
}

.clPortalQuickSearchResults {
    text-overflow: ellipsis;
    text-align: left;
    font-size: 13px;
    color: #404040;
    background-color: white;
    width: auto;
    max-width: 600px;
    min-width: 150px;
    max-height: 350px;
    list-style: none;
    margin-bottom: 0px;
}

.clPortalQuickSearchUseEnterHint {
    width: auto;
    height: auto;
    border-radius: 6px;
    padding: 6px;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 13px;
    color: #404040;
    background-color: white;
    position: absolute;
    display: none;
    z-index: 20;
    -moz-box-shadow: 1px 1px 5px 1px #343434;
    -webkit-box-shadow: 1px 1px 5px 1px #343434;
    -o-box-shadow: 1px 1px 5px 1px #343434;
    box-shadow: 1px 1px 5px 1px #343434;
}

.clPortalQuickSearchLoading {
    width: 200px;
    height: 100px;
    display: none;
    background-repeat: no-repeat;
    background-position: center;
}

.clPortalQuickSearchNoResult {
    padding: 6px;
    font-style: italic;
}

.clPortalQuickSearchResultRow {
    padding: 6px;
    max-width: 580px;
    cursor: pointer;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
}

.clPortalQuickSearchResultRow:hover {
    background-color: #bbf2ff;
}

.clPortalQuickSearchResultRowText {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 560px;
    display: block;
    overflow: hidden;
    margin-left: 6px;
}

/*-------------------------------------------------*/
/*-------------------Count Objects-----------------*/
/*-------------------------------------------------*/

.clPortalCountObjectResultNum {
    border-radius: 0.8em;
    text-align: center;
    vertical-align: middle;
    padding: 0.2em;
    min-width: 1.2em;
    display: inline-block;
    line-height: 1em;
}

.clPortalCountObjectNum-safe {
    background-color: #33b679;
    color: #404040;
}

.clPortalCountObjectNum-warn {
    background-color: #f5e79e;
    color: #404040;
}

.clPortalCountObjectNum-crit {
    background-color: #e53935;
    color: white;
}
/*-------------------------------------------------*/
/*-----------------------Tiles---------------------*/
/*-------------------------------------------------*/

.clPortalTiles {
    width: 100%;
    height: 100%;
    display: inline-block;
    position: relative;
}
    /*.clPortalTiles > .clPortalLinkTile {
        margin-left: 15px;
        margin-bottom: 15px;
    }*/

.clPortalTile {
    width: 100%;
    font-size: 13px;
    display: inline-block;
}

.clPortalLinkTile {
    box-shadow: 1px 1px 8px 0px #656565;
    border-radius: 3px;
    overflow: hidden;
}

.clPortalTile-background {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.clPortalTile-foreground {
    position: absolute;
    top: Calc(100% - 70px);
    height: Calc(100% - 12px);
    width: Calc(100% - 12px);
    background-color: rgba(60,60,60,.85);
    color: #fff;
    padding: 6px;
    transition: all 0.6s;
}
    .clPortalTile-foreground.hover {
        top: 0px;
        overflow-y: auto;
    }

.clPortalTile-header {
    height: 64px;
    padding-top: 16px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}
.clPortalTile-content {
    width: Calc(100% - 12px);
    display: flex;
    justify-content: space-around;
    align-content: space-around;
    flex-wrap: wrap;
    overflow: hidden;
    position: absolute;
    top: 80px;
}
    .clPortalTile-content .clPortalTile-item {
        text-align: center;
        flex: auto;
        min-width: 75px;
        padding: 8px;
        border-radius: 5px;
    }
.clPortalTile-item:hover {
    background: rgba(200,200,200,0.8);
}
    .clPortalTile-content .clPortalTile-itemIcon {
        font-size: 20px;
    }
    .clPortalTile-content .clPortalTile-itemName {
        display: block;
        font-weight: bold;
    }


.clPortalTile-contentLinear {
    width: Calc(100% - 12px);
    overflow: hidden;
    position: absolute;
    top: 80px;
}
    .clPortalTile-contentLinear .clPortalTile-item {
        width: Calc(100% - 16px);
        height: 42px;
        padding: 8px;
        position: relative;
        border-radius: 5px;
    }

    .clPortalTile-contentLinear .clPortalTile-itemIcon {
        font-size: 20px;
        line-height: 28px !important;
        float: left;
        margin: 8px;
    }
    .clPortalTile-contentLinear .clPortalTile-itemRight {
        height: 42px;
        width: Calc(100% - 55px);
        position: absolute;
        left: 47px;
        display: table;
        table-layout: fixed;
    }
    .clPortalTile-contentLinear .clPortalTile-itemVert {
        display: table-cell;
        vertical-align: middle;
    }
    .clPortalTile-contentLinear .clPortalTile-itemName {
        display: block;
        font-weight: bold;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 100%;
    }
    .clPortalTile-contentLinear .clPortalTile-itemDesc {
        font-size: 11px;
        display: block;
        text-overflow: ellipsis;
        word-wrap: break-word;
        overflow: hidden;
        max-height: 26px;
        line-height: 13px;
    }

.clPortalTextTile {
    box-shadow: 1px 1px 8px 0px #656565;
    z-index: 10;
}
.clPortalTextTile-position {
    position: absolute;
    top: 0;
    left: 0;

}
.clPortalTile-backgroundImg {
    width: 50%;
    height: 100%;
    display: inline-block;
}

.clPortalTile-backgroundText {
    height: Calc(100% - 50px);
    width: Calc(50% - 50px);
    float: right;
    padding: 25px;
    display: flex;
    flex-flow: column;
}
.clPortalTile-backgroundOnlyText {
    height: Calc(100% - 50px);
    width: Calc(100% - 50px);
    padding: 25px;
    display: flex;
    flex-flow: column;
}
.clPortalTile-Title {
    font-size: 22px;
    background: repeating-linear-gradient(180deg,transparent,transparent .6rem,rgba(255,255,255,.15) 0rem,rgba(255,255,255,.15) 0rem,transparent .8rem,transparent 1.2rem);
    letter-spacing: .05em;
    text-transform: uppercase;
    flex: 0 1 auto;
}
.clPortalTile-Subtitle {
    font-size: 12px;
    padding-top: .2rem;
    padding-bottom: .2rem;
    margin-top: 1rem;
    margin-bottom: .2rem;
    font-weight: 700;
    border-style: solid;
    border-width: 1Px 0;
    flex: 0 1 auto;
}
.clPortalTile-TextWrapper {
    width: 100%;
    margin-top: 1rem;
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;

    /* Fireforx scrollbar */
    scrollbar-color: #808080 rgba(0,0,0,0);
    scrollbar-width: thin;
}

/* Chrome/Webkit scrollbar */
.clPortalTile-TextWrapper::-webkit-scrollbar {
    width: 6px;
}
.clPortalTile-TextWrapper::-webkit-scrollbar-track {
    background: rgba(0,0,0,0);
}
.clPortalTile-TextWrapper::-webkit-scrollbar-thumb {
    background: #808080;
    border-radius: 10px;
}

.clPortalTile-TextContent {
    width: 100%;
    height: auto;
    padding-right: 20px;
    font-size: 12px;
}
.clPortalTile-Footer {
    padding-top: 15px;
    flex: 0 1 auto;
}
.clPortalTile-Button {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .07em;
    text-transform: uppercase;
    display: inline-block;
    padding: .6em 1.2em .6em 1.2em;
    line-height: 1;
    text-align: center;
    background-color: transparent;
    border: 1px solid;
}

.clPortalTile-Slider {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.clPortalTile-SliderBottom {
    bottom: 0px;
    left: 50%;
    float: left;
    position: absolute;
    z-index: 70;
}
.clPortalTile-SliderBottom2 {
    left: -50%;
    position: relative;
    float: left;
}
.clPortalTile-SliderCircle {
    position: relative;
    display: inline-block;
    margin: 4px;
    width: 12px;
    height: 12px;
    transition: all 0.3s;
    cursor: pointer;
    font-size: 13px;
    padding: 0;
    color: #fff;
}
    .clPortalTile-SliderCircle:hover:before {
        content: '\f192'
    }
.clPortalTile-SliderArrow {
    position: absolute;
    top: 45%;
    margin: 5px;
    transition: all 0.3s;
    cursor: pointer;
    font-size: 36px;
    padding: 0;
    color: #fff;
    z-index: 70;
}
    .clPortalTile-SliderArrow.hover {
        display: inline-block;
    }
    .clPortalTile-SliderArrow.left {
        left: 0;
    }
    .clPortalTile-SliderArrow.right {
        right: 0;
    }

/*-------------------------------------------------*/
/*--------------------TableViews-------------------*/
/*-------------------------------------------------*/

.clPortalTVContainer {
    height: 100%;
    overflow-y: auto;
}
.clPortalTVNotifications {
    position: absolute !important;
    top: 3px !important;
    left: 12px;
}
    .clPortalTVNotifications div {
        float: left;
        padding: 4px;
        height: 16px !important;
        font-size: 13px !important;
        margin-bottom: 0px !important;
    }
.clPortalTVImgMenu {
    float: left;
    margin: 6px;
    font-size: 20px;
    height: 20px;
    cursor: pointer;
}
.clPortalTVImgHeader {
    float: right;
    margin: 6px;
    font-size: 20px;
    height: 20px;
    cursor: pointer;
}
.clPortalTVImgDisable {
    opacity: 0.3;
    cursor: default !important;
}
.clPortalTVWrapper {
    min-height: 250px;
}
    .clPortalTVWrapper.col-1 {
        width: Calc(50% - 5px);
        display: inline-block;
    }
        .clPortalTVWrapper.col-1.firstC {
            margin-right: 10px;
        }
    .clPortalTVWrapper.col-2 {
        width: 100%;
    }
    .clPortalTVWrapper.row-1 {
        height: Calc(50% - 5px);
    }
        .clPortalTVWrapper.row-1.firstR {
            margin-bottom: 10px;
        }
    .clPortalTVWrapper.row-2 {
        height: 100%;
    }
    .clPortalTVWrapper.row-3 {
        height: Calc(33.3% - 7px);
    }
        .clPortalTVWrapper.row-3.firstR {
            margin-bottom: 10px;
        }
    .clPortalTVWrapper.row-4 {
        height: Calc(25% - 7.5px);
    }
        .clPortalTVWrapper.row-4.firstR {
            margin-bottom: 10px;
        }
.clPortalTVHeader {
    height: 32px;
    text-align: center;
    border-radius: 8px 8px 0 0;
}
.clPortalTVName {
    font-size: 14px;
    font-weight: bold;
    line-height: 32px;
}
.clPortalTVContent {
    height: Calc(100% - 34px);
}

/*-------------------------------------------------*/
/*---------------------Sidebar---------------------*/
/*-------------------------------------------------*/
.clPortalSidebar {
    height: Calc(100% - 14px); /* margin top of first item */
    overflow: auto;

    /* Fireforx scrollbar */
    scrollbar-color: #808080 rgba(0,0,0,0);
    scrollbar-width: thin;
}

/* Chrome/Webkit scrollbar */
    .clPortalSidebar::-webkit-scrollbar {
        width: 6px;
    }
    .clPortalSidebar::-webkit-scrollbar-track {
        background: rgba(0,0,0,0);
    }
    .clPortalSidebar::-webkit-scrollbar-thumb {
        background: #808080;
        border-radius: 10px;
    }

.clPortalSidebar-item {
    margin:14px 14px 0px 14px;
}
.clPortalSidebar-itemHeader {
    height: 40px;
    border-radius: 8px;
    box-shadow: 9px 9px 12px -5px rgba(0,0,0,0.55);
    transition: all 0.2s;
    transform: scale(1);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
    .clPortalSidebar-itemHeader:hover {
        transform: scale(1.05);
        cursor: pointer;
    }
.clPortalSidebar-itemOpened {
    height: 40px;
    border-radius: 8px 8px 0 0 !important;
    box-shadow: 9px 9px 12px -5px rgba(0,0,0,0.55);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.clPortalSidebar-itemName {
    font-size: 16px;
    font-weight: bold;
    line-height: 40px;
    padding-left: 14px;
}
.clPortalSidebar-itemIcon {
    font-size: 19px;
    line-height: 40px !important;
    padding-left: 14px;
}
.clPortalSidebar-itemContent {
    background-color: white;
    box-shadow: 9px 9px 12px -5px rgba(0,0,0,0.55);
    display: none;
    overflow: auto;
    max-height: 300px;

    /* Fireforx scrollbar */
    scrollbar-color: #808080 rgba(0,0,0,0);
    scrollbar-width: thin;
}

/* Chrome/Webkit scrollbar */
    .clPortalSidebar-itemContent::-webkit-scrollbar {
        width: 6px;
    }
    .clPortalSidebar-itemContent::-webkit-scrollbar-track {
        background: rgba(0,0,0,0);
    }
    .clPortalSidebar-itemContent::-webkit-scrollbar-thumb {
        background: #808080;
        border-radius: 10px;
    }

.clPortalSidebar-subItem {
    margin: 0px 10px;
    padding: 6px 0px;
    border-bottom: 1px solid lightgray;
}
.clPortalSidebar-subItem:last-child {
    border: 0;
}
.clPortalSidebar-subItemImg {
    height: 35px;
    width: 35px;
    padding-right: 10px;
}
.clPortalSidebar-subItemIcon {
    font-size: 18px;
    padding: 3px 10px;
}
.clPortalSidebar-subItemText {
    font-size: 14px;
    transition: all 0.2s;
}
    .clPortalSidebar-subItemText:hover {
        font-size: 15px;
    }

.clPortalSidebar-subItemCounter {
    position: absolute;
    right: 0px;
    border-radius: 3px;
    padding: 0px 3px;
    font-size: 14px;
}
