/*! powerscope.css | copyright 2017 | http://www.perfluence.com/ */

/** -- FONT-FACE -- **/
@font-face {
    font-family: 'Myriad Pro Regular';
    font-style: normal;
    font-weight: normal;

    src: local('Myriad Pro Regular'), url('./font/myriad-pro/MYRIADPRO-REGULAR.woff') format('woff');
}

@font-face {
    font-family: 'Myriad Pro Bold';
    font-style: normal;
    font-weight: normal;

    src: local('Myriad Pro Bold'), url('./font/myriad-pro/MYRIADPRO-BOLD.woff') format('woff');
}

@font-face {
    font-family: 'Eurofurence';
    font-style: normal;
    font-weight: normal;
    src: local('Eurofurence'), url('./font/eurofurence/eurof35.ttf') format('truetype');
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;

    src: url(./font/material-design-icons/MaterialIcons-Regular.eot);
    src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(./font/material-design-icons/MaterialIcons-Regular.woff2) format('woff2'),
    url(./font/material-design-icons/MaterialIcons-Regular.woff) format('woff'),
    url(./font/material-design-icons/MaterialIcons-Regular.ttf) format('truetype');
}

.powerscope-icons {
    display: inline-block;
    width: 1em;
    height: 1em;
    font-family: 'powerscope' !important;
    font-size: 24px;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;

    direction: ltr;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-feature-settings: 'liga';
    -moz-font-feature-settings: 'liga=1';
    -moz-font-feature-settings: 'liga';
    -ms-font-feature-settings: 'liga' 1;
    -o-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    -khtml-user-select: none;
}

@font-face {
    font-family: 'powerscope';
    src: url('./font/powerscope/powerscope.eot?cxd1rr');
    src: url('./font/powerscope/powerscope.eot?cxd1rr#iefix') format('embedded-opentype'),
    url('./font/powerscope/powerscope.ttf?cxd1rr') format('truetype'),
    url('./font/powerscope/powerscope.woff?cxd1rr') format('woff'),
    url('./font/powerscope/powerscope.svg?cxd1rr#powerscope') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    font-family: 'Myriad Pro Regular', 'Helvetica', 'sans-serif' !important;
}

.row .left-content.col {
    padding: 0 .75rem 0 .3rem;
}

.textfield__label::after {
    background-color: #5a9dae;
}

.error .textfield__label::after,
.invalid .textfield__label::after {
    background-color: rgb(244, 67, 54);
}

.floating-label.is-focused .textfield__label,
.floating-label.is-dirty .textfield__label {
    color: #5a9dae;
}

.selectLabel, .selectLabelWide {
    font-size: 14px;
    color: #5a9dae;
}

.selectLabel + .select-component-container.select-type {
    width: 50px;
}

.selectLabelWide + .select-component-container.select-type {
    width: 110px;
}
.selectLabelWide + div .select-component-container.select-type {
    width: 130px;
}

.error .floating-label.is-focused .textfield__label,
.error .floating-label.is-dirty .textfield__label,
.invalid.floating-label.is-focused .textfield__label,
.invalid.floating-label.is-dirty .textfield__label {
    color: rgb(244, 67, 54);
}

html {
    font-size: 1em;
    line-height: 1.4;
    color: #222;
}

::-moz-selection {
    text-shadow: none;
    background: #b3d4fc;
}

::selection {
    text-shadow: none;
    background: #b3d4fc;
}

hr {
    display: block;
    height: 1px;
    padding: 0;
    margin: 1em 0;
    border: 0;
    border-top: 1px solid #ccc;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    padding: 0;
    margin: 0;
    border: 0;
}

textarea {
    resize: vertical;
}

#root > div {
    background-color: #f9f9f9;
}

.opened-navigator {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
}
.retracted-navigator {
    -webkit-transform: translateX(-301px);
    transform: translateX(-301px);
}

.root-content {
    overflow: hidden;
}

.opportunity-container {
    padding: 15px;
}

#opportunity-container {
    margin-top: 2em;
}

.opportunity-body {
    max-height: 15em;
    overflow-y: scroll;
}

.opportunity-container li {
    width: 100%;
    list-style-position: outside;
    list-style-type: disc;
    cursor: pointer;
}

#opportunity-container .input-wrapper input {
    max-width: 300px;
}

.opportinuty-body > section {
    padding: 0 15px;
}

.navigator-addicon-wrapper {
    /* position: relative; */
    display: inline-block;
    /* height: auto; */
    padding-top: .5em;
    vertical-align: top;
}

/** -- Navigation -- **/
.navigator-wrapper > div {
    position: relative;
    display: block;
    width: 300px;
    background-color: transparent;
}

.navbar-item.navigator-wrapper + div {
    position: absolute;
    top: 0;
    width: 100%;
}

.navigator-wrapper {
    overflow-x: hidden;
}

#navigator-wrapper {
    width: 300px;
}

#navigator {
    background-color: transparent;
    box-shadow: none;
}

nav#navigator ul.navigator-container li:hover {
    background-color: rgba(246, 246, 246, 1);
}

.navigator-container > li:first-child {
    float: none;
    border-top: 1px solid #ddd;
}

.navigator-container > li {
    /* width: 100%; */
    color: #444;
    background-color: #f6f6f6;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
}

.navsection-list li:last-child {
    margin-bottom: 15px;
}

.navsection-list .navsection-row-wrapper .navsection-list-item > span.col-3:nth-child(3),
.navsection-list .navsection-row-wrapper .navsection-list-item > span.col-3:nth-child(3) * {
    cursor: default;
}

.navigator-content {
    position: relative;
    left: 0;
    width: 299px;
    margin: 0;
    background-color: #f6f6f6;
}

.navigator-content.collapsible {
    padding: 0;
}

.navigator-content > li {
    display: block;
    width: 100%;
}

.navigator-content li {
    color: #000;
}

.navigator-content > ul {
    margin: 0;
}

.navigator-content .collapsible-body input {
    text-align: center;
}

.navigator-content .collapsible-body input.search {
    width: 90%;
}

.navigator-content *::-webkit-input-placeholder,
.navigator-content *:-moz-placeholder,
.navigator-content *::-moz-placeholder,
.navigator-content *:-ms-input-placeholder {
    color: #444;
}

.navigator-content .collapsible-body input.button-import,
.navigator-content .collapsible-body input.button-add {
    display: inline-block;
    width: 40%;
    margin: auto 10px 10px 10px;
    font-size: 10px;
    text-align: center;
    background-color: transparent;
}

.navigator-content .row,
.navigator-content .col {
    float: none;
}

.navsection-header {
    position: relative;
    display: block;
    height: 3rem;
    padding: 0 1rem;
    font-family: "Myriad Pro Bold", Helvetica, sans-serif; /* A ENLEVER apres suppression import mdl*/
    line-height: 3rem;
    color: #fff;
    cursor: pointer;
    background-color: #779fa6;
    /* border-bottom: 1px solid #ddd; */
}

.navsection-search {
    text-align: center;
}

.navsection-search .input-wrapper {
    display: inline-block;
    width: 75%;
    margin-right: 1em;
}

.navsection-search .input-wrapper .textfield__input {
    border-color: rgba(0, 0, 0, .22);
}

#root .textfield__input {
    font-family: 'Myriad Pro Regular', Helvetica, sans-serif;
    font-size: 14px;
    border-radius: 0;
}

#root .textfield__label {
    font-family: 'Myriad Pro Regular', Helvetica, sans-serif;
    font-size: 14px;
}

.search-add {
    display: inline-block;
    /* margin: .3em 0; */
    font-size: 30px;
    color: #779fa6;
    vertical-align: top;
    cursor: pointer;
    transition: color .3s ease;
}

.navigator-addicon-wrapper.disabled .search-add {
    color: #ccc;
    cursor: default;
}

.navsection-search > input {
    width: 90%;
    box-sizing: border-box;
    padding: 0 15px;
    margin: 15px 0;
}

.targetContact,
.is-target {
    background-color: #ff0;
}

.targetBackground {
    fill: #ff0;
}

.btn-accent.btn-accent.btn-raised.section-search-button {
    float: right;
    height: 24px;
    margin: 16px;
    font-size: 12px;
    line-height: 24px;
    background-color: #779fa6;
}

.navsection-list li {
    display: block;
    width: 100%;
}

.navsection-list {
    padding: 0 15px;
    overflow-y: hidden;
}

.navsection-list > ul {
    padding: 0;
}

.navsection-list li.navsection-list-item {
    height: 24px;
}

.navsection-list-item > span {
    display: inline-block;
    width: 97%;
    padding: 0 5px;
    vertical-align: top;
    cursor: pointer;
}

.navsection-list-item > span.icn-navigation {
    left: 1px;
    width: 33px;
    height: 24px;
    margin: 0;
    background-size: 50% auto;
}

.navsection-list-item > span.icn-navigation + span {
    width: calc(100% - 53px);
    height: 24px;
}

.navsection-row-wrapper > .navsection-list-item > span:hover {
    background-color: rgba(0, 0, 0, .1);
}

.navsection-row-wrapper > .navsection-list-item > span.targetBackground:hover {
    background-color: #ffcc7e;
}

.navsection-list-item > span.wide-item {
    width: 100%;
}

.navsection-list-item .icn-navigation {
    background-size: 50% auto;
}

.navsection-list-item > span.col-1 {
    width: 97%;
}

.navsection-list-item > span.col-2 {
    width: 49%;
}

.navsection-list-item > span.col-3 {
    width: 29%;
}

.icn-navigation .powerscope-icons {
    position: relative;
    top: 2px;
    font-size: 20px;
    color: #222;
}

#contactSheetSearch,
.navsection-search > input {
    display: inline-block;
    width: 200px;
    margin-right: .5em;
}

#contactSheetSearch + .icn,
.navsection-search > input + .icn {
    background-size: 65% auto;
}

.navsection-search .select-cancel {
    position: absolute;
    top: 35%;
    right: 6px;
}

.icn-menu-settings {
    cursor: pointer;
}

.icn-menu-settings:hover {
    background-color: rgba(0, 0, 0, .1);
}

.subNav-wrapper .sub-nav .icn-menu-settings {
    height: 100%;
    min-height: 40px;
    margin: 0;
    overflow: visible;
    color: #fff;
    vertical-align: middle;
    flex-direction: row;

    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-flex-direction: row;
}

.activity-menu-wrapper {
    height: auto;
}

.icn-menu-settings > span {
    display: block;
    width: 45px;
    font-size: 28px;
    line-height: 1.50em;
    text-align: center;
}

.icn-menu-settings > span:hover {
    background-color: rgba(0, 0, 0, .1);
}

.icn-menu-settings .settings-wrapper {
    top: 0;
    right: -25px;
    z-index: 998;
}

.icn-menu-settings .settings-wrapper li {
    line-height: 32px;
}

.icn-menu-settings .settings-wrapper li > .powerscope-icons {
    position: relative;
    top: 2px;
    left: -9px;
    font-size: 16px;
}

/* ###### TMP ####### */

.itemNodesContainer {
    padding: 0;
    margin: 0;
}

.itemNodesContainer > div {
    max-width: 600px;
    max-height: 40px;
    margin: 0;
}

.itemNodesContainer > div.itemNodesContainer {
    max-width: none;
}

#fullPageMenu .itemNodesContainer > div {
    max-width: none;
}

.subNav-wrapper {
    min-height: 25px;
    box-sizing: border-box;
    margin: 1em;
}

#activity-menu-container .itemNodesContainer {
    position: relative;
}

#activity-menu-container .itemNodesContainer .icn-menu-settings {
    position: absolute;
    right: 0;
}

.navigator-tabs {
    padding: 0;
}

.navigator-tabs-item {
    display: block;
    width: 100%;
    padding: 0 15px;
    cursor: pointer;
    border-bottom: 1px solid #888;
}

.photo-profil {
    width: 110px;
    height: 110px;
    padding: 1em;
    text-align: center;
    background-color: #d9dadb;
    border-radius: 50%;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.photo-profil > * {
    width: 100%;
    text-align: center;
}

/** FIELDCARD **/
.fieldCard-container {
    padding: 16px;
    margin-bottom: 1em;
    background-color: #fff;
}

.fieldCard-container .select-component-container .placeholder,
.fieldCard-container .listInput .textfield__label,
.fieldCard-container .listInput.is-dirty:hover .textfield__label {
    display: inline-block;
    visibility: hidden;
}

.fieldCard-container .select-component-container:hover .placeholder,
.fieldCard-container .listInput:hover .textfield__label {
    visibility: visible;
}

.listInput {
    position: relative;
}
.listInput > input {
    border-bottom: none
}
.listInput > label {
    top: 4px;
}

.listInput .select-cancel {
    position: absolute;
    top: 15%;
    right: 6px;
    opacity: 0;
}

.listInput:hover .select-cancel,
.textfield__input:focus + label + .select-cancel {
    opacity: 1;
}


#contact-container {
    padding-top: 1em;
}

#sheet-container {
    padding-top: 1em;
}

section.sheet-container {
    max-height: 14em;
    overflow-y: scroll;
}

.sheet-content > li {
    width: 100%;
    border-bottom: 1px solid #888;
}

.sheet-content > li:first-child {
    border-top: 1px solid #888;
}

.contact-item {
    padding: 0 15px;
}

.sheet-item {
    padding: 0 15px;
}

.nav-btn.btn {
    text-align: left;
    background-color: transparent;
    box-shadow: 0 0 0 rgba(255, 255, 255, .0);
}

.nav-btn.btn:hover {
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
}

.sheet-item > span {
    float: none;
}

.fieldCard-container textarea {
    min-height: 4em;
}

.listCard-container.card {
    position: relative;
    padding-top: 15px;
    padding-bottom: 0;
    margin-bottom: 2em;
    background-color: #fff;
}

.listCard-container.card footer {
    display: block;
    height: 40px;
}

.listCard-container.card footer > i {
    display: block;
    float: right;
    margin-top: 4px;
    margin-right: 18px;
    font-size: 32px;
    color: #779fa6;
    cursor: pointer;
}

.fieldCard-container .card {
    width: 100%;
}

.select-component-container .option-wrapper {
    position: absolute;
    bottom: auto; /* -1px; */
    left: 0;
}

.graph-menu-content .select-component-container .option-wrapper {
    top: 25px;
}

.popupRelation-container .select-component-container .option-wrapper {
    top: 20px;
    bottom: auto;
}

.fieldCard-container > div .select-component-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    align-content: center;
}

.fieldCard-container .table-body .table-row .textfield__label::after {
    bottom: 0;
}

.fieldCard-container .table-body .table-row .textfield__input {
    border-bottom: none;
}

.field-container .formContainer > div {
    align-items: center;
}

.listCard-container.card .dropzone_message_container,
.dropzone_message_container {
    position: absolute;
    top: -5px;
    left: -4px;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: 100%;
    min-width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    border: 4px dashed #fff;
    border-radius: 8px;
    transition: background .4s ease;

    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    align-items: center;
    justify-content: center;
}

.listCard-container.card .dropzone_message_container > span,
.dropzone_message_container > span {
    z-index: 2;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    width: 100%;
    font-size: 1.5em;
    font-weight: bold;
    color: #fff;

    justify-content: center;
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    align-self: center;
}

.listCard-container.card.dropzone > header,
.listCard-container.card.dropzone > .formContainer,
.listCard-container.card.dropzone > footer,
.dropzone > header,
.dropzone > .formContainer,
.dropzone > footer {
    filter: blur(2px);

    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
}

.drogBox {
    background-color: #00f;
    opacity: 1;
}

.update-field > div {
    padding: 0 24px;
}

.update-field label,
.update-field input {
    display: block;
}

.update-field label {
    font-size: .8rem;
    color: #9e9e9e;
}

.update-field input {
    height: 25px;
    margin-bottom: 1em;
    background-color: #f6f6f6;
    border-color: #9e9e9e;
}

.row .col .opportunity-input-container {
    padding: 0 15px;
}

.opportunity-input-container .input-wrapper input,
.opportunity-input-container .input-wrapper label {
    display: block;
}

.opportunity-input-container .input-wrapper input {
    margin-bottom: 1em;
}

.activity-section {
    box-sizing: border-box;
}

.formContainer form {
    margin: 0;
}

.formContainer form {
    width: calc(100% + 15px);
}

.opportunity .table-header .table-row > div,
.opportunity .table-body .table-row > div {
    width: 30.8%;
}

.hunted .table-body .table-row > div.table-minus-deletable,
.relations-interpersonnelles .table-body .table-row > div.table-minus-deletable,
.lui-reportent .table-body .table-row > div.table-minus-deletable,
.report-a .table-body .table-row > div.table-minus-deletable,
.target .table-body .table-row > div.table-minus-deletable,
.opportunity .table-body .table-row > div.table-minus-deletable,
.personInCharge .table-body .table-row > div.table-minus-deletable {
    width: 6%;
    vertical-align: top;
}

.table-body .table-row > .table-minus-deletable > span {
    font-size: 17px;
    color: #444;
    text-align: center;
}

.table-selectable .table-body {
    position: relative;
}

.table-selectable .table-body .table-row {
    position: relative;
}

.fullPage-table-container {
    position: relative;
    background-color: #fff;
}

.fullPage-table-container header,
.fullPage-table-container .fullPage-table-row {
    display: block;
    padding: 0 16px;
    margin: 0;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
}

.fullPage-table-container .fullPage-table-row {
    padding: 0 16px;
}

.fullPage-table-container header {
    height: 25px;
    font-size: 12px;
    font-weight: bold;
    color: rgba(0, 0, 0, .54);
    text-overflow: ellipsis;
    text-transform: capitalize;
    vertical-align: bottom;
    border-top: 1px solid rgba(0, 0, 0, .12);
}

.fullPage-table-container header > div {
    height: 32px;
}

.fullPage-table-container header > div > span {
    padding-left: 8px;
}

.fullPage-table-container header > .fullPage-table-checkbox-wrapper {
    padding-left: 0;
    vertical-align: top;
}

.fullPage-table-row:hover,
.fullPage-table-row.selected {
    background-color: #eee;
    transition: background .3s ease;
}

.fullPage-table-checkbox-wrapper {
    display: inline-block;
    margin: 0;
}

.fullPage-table-checkbox-wrapper {
    width: 42px;
}

.fullPage-table-row > div {
    height: 100%;
    vertical-align: middle;
}

.fullPage-search .search_input {
    width: 35%;
    min-width: 250px;
}

.fullPage-search .search_input + .powerscope-icons {
    margin-left: 16px;
    color: #779fa6;
    vertical-align: bottom;
    cursor: pointer;
}

.fullPage-head,
.fullPage-search {
    display: block;
    width: 100%;
}

.fullPage-search {
    padding: 1em 1em 0;
    margin: 1em 0 2em;
}

.fullPage-head::before {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 6px;
    margin-left: 1em;
    content: " ";
    background-color: #779fa6;
}


.clickable {
    text-decoration: underline;
    cursor: pointer;
}

.fullPage-table-content {
    max-height: 398px;
    overflow-y: scroll;
}

.fullPage-table-container header > div:last-child > span,
.fullPage-table-row > div:last-child > span {
    border-right: none;
}

.fullPage-head {
    display: block;
    width: 100%;
    padding: 8px;
}

.cardlist-link {
    cursor: pointer;
}

.powermap-network {
    cursor: pointer;
}

#network-container {
    margin-top: 2em;
}

.networkColorBox {
    width: 50px;
    height: 50px;
    cursor: pointer;
}

#networkColor {
    margin-bottom: 2em;
}

.table-minus-deletable {
    max-height: 100%;
    vertical-align: top;
}

.table-minus-deletable > span {
    position: relative;
    top: 2px;
    padding: 2px;
    border-radius: 50%;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.table-minus-deletable > span:hover,
.table-body .table-row > .table-minus-deletable > span:hover {
    color: #fff;
    background-color: #444;
}

.table-row-content-wrapper > div {
    padding: 5px 15px;
    border-top: 1px solid #c6c7c8;
}

.table-row-content-wrapper > div:first-child {
    border-top: none;
}

.user-field-input-wrapper > input {
    height: 25px;
    margin: 5px 0;
    background-color: #f6f6f6;
}

.listCard-container .user-field {
    padding-bottom: 2em;
}

.row .inclination .input-field {
    width: 100px;
    height: 25px;
}

.row .inclination .input-field select {
    min-width: 65px;
    padding-left: 0;
    text-align: left;
}

.row select.table-input-select.inclination-select {
    position: relative;
    top: -4px;
    padding-left: 18px;
}

.row .formContainer.active > *.col {
    padding: 0;
}

.formContainer {
    position: relative;
    border-bottom: 1px solid #c6c7c8;
    /* padding: 0; */
    /* margin: 0; */
    width: 100%;
}

.formContainer > div {
    /* display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox; */
    display: flex;
    vertical-align: top;
    /* flex-direction: column; */

    flex-wrap: wrap;
    align-items: center;
    /* justify-content: center; */
    /* flex-grow: 1; */
}

.component-select-option-wrapper {
    display: flex;
    flex-direction: column;
}

.component-select-option-wrapper .select-component-option {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;

    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
}

.formContainer .component-select-option-wrapper .select-component-option {
    border-top: 1px solid #ccc;
}

.formContainer .component-select-option-wrapper .select-component-option:first-child {
    border-top: none;
}

.component-select-option-wrapper .select-component-option .dataList--option-wrapper {
    display: flex;
    flex-direction: row;
    flex: 1;
}

.component-select-option-wrapper .select-component-option .dataList--option-wrapper .option-item {
    padding-left: 4px;
}

.placeholder {
    color: rgba(0, 0, 0, .21);
}

.formContainer .component-select-option-wrapper {
    position: absolute;
    /*min-width: 380px;*/
}

.listCard-container.card .formContainer + footer {
    height: 16px;
}

.levelPicker .component-select-option-wrapper {
    left: 0;
}

.component-select-option-wrapper {
    position: relative;
    z-index: 999;
    background-color: #fff;
    border: 1px solid #ccc;
}

.table-selectable .table-body > .table-row.collapsible-table:hover .component-select-option-wrapper * {
    color: #444;
}

.datalist-item-1 {
    width: 100%;
}
.datalist-item-2 {
    width: 50%;
}
.datalist-item-3 {
    width: 33.3333%;
}

.select-component-option {
    z-index: 100;
    min-width: 30px;
    padding: 0 4px;
    cursor: pointer;
}

.select-component-option:hover {
    background-color: rgba(0, 0, 0, .1);
}

.component-select-option-wrapper .select-component-option.highlighted {
    /* background-color: #ccc; */
    border: 2px solid #666666;
}

.select_cover {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 50;
    cursor: default;
}

.inclination-wrapper .inclination-color,
.inclination-select option::before {
    position: relative;
    top: 2px;
    right: 5px;
    display: inline-block;
    width: 15px;
    height: 15px;
    box-sizing: border-box;
    content: '';
    background-color: transparent;
    border: 1px solid #444;
    border-radius: 50%;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

/** Inclination Color **/
.inclination-select option.allied::before {
    display: inline-block;
    content: '';
    background-color: #b8ffad;
    border-color: #b8ffad;
}

.inclination-select option.backer::before {
    display: inline-block;
    content: '';
    background-color: #ebffc5;
    border-color: #ebffc5;
}

.inclination-select option.neutral::before {
    content: '';
    background-color: #eee;
    border-color: #eee;
}

.inclination-select option.hostile::before {
    content: '';
    background-color: #ffe4c5;
    border-color: #ffe4c5;
}

.inclination-select option.enemy::before {
    content: '';
    background-color: #f99;
    border-color: #f99;
}

.inclination-select option {
    padding-left: 15px;
}

.inclination-wrapper .inclination-color {
    position: absolute;
    top: 4px;
    left: 0;
    z-index: 1;
}

.inclination-wrapper {
    overflow: visible;
}

.inclination-select {
    padding-left: 15px;
}

.inclination-select__color,
.inclination-select__color .inclination-color__square,
.inclination-select__color .inclination-color__label {
    display: flex;
    align-items: center;
}

.inclination-select__color .inclination-color__square,
.inclination-select__color .inclination-color__label {
    vertical-align: center;
}

.inclination-select__color .inclination-color__square {
    width: 10px;
    height: 10px;
    margin-right: 5px;
}

.row .input-field,
.row .inputColumnLevelPicker .input-field.col.s12 {
    width: 40px;
    padding: 0;
    margin-top: 0;
}

select.table-input-select,
.inputColumnLevelPicker select.table-input-select {
    display: inline-block;
    width: auto;
    min-width: 53px;
    height: 29px;
    padding: 0;
    color: #000;
    color: rgba(0, 0, 0, 0);
    text-align: center;
    text-shadow: 0 0 0 #000;
    cursor: pointer;
    background-color: transparent;
    border: none;

    -webkit-align-items: center;
}

select.table-input-select option,
.inputColumnLevelPicker select.table-input-select option {
    background-color: #fff;
}

select.table-input-select:hover option,
.inputColumnLevelPicker select.table-input-select:hover option {
    color: #222;
}

select.table-input-select:focus,
.inputColumnLevelPicker select.table-input-select:focus {
    outline: none;
}

.objets-container ul li i {
    display: block;
    float: left;
    width: 2rem;
    margin-right: 1rem;
    font-size: 1.6rem;
    line-height: 3rem;
    text-align: center;
}

.sub-nav {
    position: fixed;
    z-index: 998;
    width: calc(100% - 29px);
    padding: 0;
    background-color: #c5dde5;
}

.content-compressed .sub-nav {
    width: calc(100% - 330px);
}

#fullPageMenu .itemNodesContainer .sub-nav-item {
    width: 4em;
}

.sub-nav .sub-nav-item .icn {
    background-size: 60% auto;
    transition: background .05s;
}

.sub-nav .sub-nav-item.active .icn,
.sub-nav .sub-nav-item.active:hover .icn {
    background-size: 90% auto;
}

.sub-nav .sub-nav-item:hover .icn {
    background-size: 75% auto;
    transition: background .2s;
}

#fullPageMenu .sub-nav-item i {
    position: relative;
    margin-top: 3px;
    font-size: 33px;
    color: #779fa6;
    vertical-align: middle;
    border-radius: 4px;

    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

#contact-pic {
    margin: auto;
}

.profilePicture-wrapper {
    width: calc(100% - 0px);
    min-height: 1px;
    padding: 0;
    margin: 0;
}

#profilePicture {
    width: calc(100% - 0px);
    margin-top: 16px;
    font-size: 12vw;
    color: #e0e0e0;
    text-align: center;
}

#sheet-pic {
    margin: auto;
}

.plus-add {
    position: relative;
    display: inline-block;
    margin-left: 1em;
    font-size: 1.2em;
    cursor: pointer;
    border-radius: 4px;

    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

#menu-nav .menu-navigation {
    padding: 0;
}

#menu-nav .menu-navigation .navigation-item {
    padding: 0 15px;
    cursor: pointer;
    border-bottom: 1px solid #888;
}

#navbar {
    min-height: 3rem;
    line-height: 3rem;
    /* background-color: #779fa6; */
}

#feedback {
    color: #fff;
    text-decoration: none;
}

.display-none {
    display: none;
}

.pull-right {
    position: relative;
    float: right;
}

.settings-wrapper {
    position: absolute;
    top: 32px;
    right: 73px;
    width: 190px;
    padding: 0;
    margin: 0;
    color: #444;
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
}

.table-setting-container .settings-wrapper {
    position: absolute;
    top: -30px;
    right: 45px;
    z-index: 998;
}

.settings-wrapper li {
    display: block;
    float: none;
    padding: 0 15px;
    text-align: left;
    border-left: 6px solid transparent;
}

.settings-wrapper {
    width: auto;
    min-width: 250px;
}

.table-setting-container .settings-wrapper li {
    padding: 4px 15px;
}

.settings-wrapper li:hover {
    background-color: rgba(0, 0, 0, .05);
    border-left: 6px solid #444;
}

.settings-wrapper li:first-child {
    border-top: none;
}

.navigation-item a {
    color: #000;
}

.tabs-container {
    display: block;
    color: #fff;
    background-color: #779fa6;
}

nav .tabs-container > ul {
    display: block;
    width: 100%;
    max-height: 35px;
    overflow: hidden;
    transition: margin .2s ease;
}

.tabs-container .tabs-item {
    max-width: 200px;
}

.tabs-container > ul.menu-compressed {
    display: block;
    width: 80%;
    margin-left: 300px;
    transition: margin-left .3s;
}

.tabs-container > ul > li {
    padding: 0 15px;
    color: rgba(255, 255, 255, .4);
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    border-bottom: 3px solid transparent;
}

.tabs-container > ul > li.active {
    color: #fff;
    background-color: transparent;
    border-bottom: 3px solid #f2ed5d;
}

.opportunity-search-wrapper,
.opportunity-wrapper {
    padding-top: 0;
    padding-bottom: 0;
}

.add-input-box {
    position: absolute;
    top: -20px;
    left: 25px;
    z-index: 900;
    float: left;
    min-width: 220px;
    min-height: 80px;
    padding: 15px;
    overflow: visible;
    background-color: #fff;
    border: 1px solid #888;
}

.add-input-box > input {
    display: block;
    margin-bottom: 15px;
    color: #000;
}

.add-input-box > label {
    display: block;
}

.box-container {
    position: relative;
    display: inline-block;
}

.user-psw-wrapper {
    margin-bottom: 2em;
}

#login-button {
    -webkit-appearance: none;
    background-color: #779fa6;
}

/* closed fix */
.navsection-content {
    max-height: 380px;
    box-sizing: border-box;
    overflow: hidden;
    background-color: #fff;
    -webkit-transition: max-height .4s;
    -moz-transition: max-height .4s;
    transition: max-height .4s;
    width: 100%;
}

/*  closed */
.closed {
    max-height: 0;
    -webkit-transition: max-height .1s;
    -moz-transition: max-height .1s;
    transition: max-height .1s;
}

/** Select **/
.select-cancel {
    font-size: 16px;
    cursor: pointer;

    order: 2;
}

.popupRelation-container > .sub-container > div.input-wrapper .select-cancel {
    position: absolute;
    top: 15%;
    right: 6px;
}

.select-carret {
    cursor: pointer;
    order: 3;
}

.levelPicker .select-component-container .select-carret {
    margin-top: 2px;
}

.formContainer-close {
    box-sizing: border-box;
    /* padding: 4px 8px 6px; */
    font-size: 20px;
    cursor: pointer;
}

.formContainer-close:hover {
    background-color: rgba(0, 0, 0, .1);
}

.arrow-container {
    flex-direction: row;
    justify-content: flex-end;
}

.select-component-container {
    position: relative;
    height: 30px;
    padding: 0;
}

.select-component-container > input {
    padding-left: 6px;
    margin-top: 4px;
    font-size: 14px;
    border: none;
}

.formContainer .select-component-container > input {
    width: 89%;
}

.levelPicker .select-component-container,
.levelPicker .select-component-container > input {
    width: 60px;
    padding: 0;
}

.levelPicker .select-component-container .component-select-option-wrapper {
    position: absolute;
    z-index: 100;
    width: 65px;
}

.levelPicker .select-component-container > input {
    padding-left: 5px;
    font-size: 14px;
}

.fakeLevelPicker-wrapper {
    min-width: 80px;
}

.fakeLevelPicker-wrapper .select-component-container > .option-wrapper {
    top: 0;
    left: -4px;
}

.fakeLevelPicker-wrapper .select-component-container,
.popupRelation-container .sub-container .select-component-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.matrix-select-wrapper .select-component-container {
    z-index: 998;
}

.matrix-select-wrapper .component-select-option-wrapper .select-component-option {
    text-align: left;
}

.matrix-select-wrapper .component-select-option-wrapper {
    width: auto;
}

#clickZones circle {
    cursor: pointer;
}

.fakeLevelPicker-wrapper .popup-container {
    z-index: 998;
    width: 60px;
}

.fakeLevelPicker-wrapper .select-component-container .component-select-option-wrapper {
    top: 32px;
}

.fakeLevelPicker-wrapper .select-component-container > span,
.popupRelation-container .sub-container .select-component-container > span {
    align-self: center;
    flex-grow: 1;
}

.fakeLevelPicker-wrapper .select-component-container > .select-cancel {
    top: 5px;
}

.levelPicker .select-component-container.select-type span {
    min-width: 16px;
}

.listInputOn3LinesMax {
    padding-top: 8px;
    font-size: 14px;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    line-height: 16px;     /* fallback */
    max-height: 48px;      /* fallback */
    -webkit-line-clamp: 3; /* number of lines to show */
    -webkit-box-orient: vertical;
}

.select-component-container.select-type > span.select-value {
    padding: 2px 4px 0;

    flex-grow: 3;
}

.levelPicker .select-component-container.select-type span:first-child {
    order: 1;
}

.table-row:hover .levelPicker .select-component-container > input,
.pws_color, .pws_color:hover {
    color: #fff;
    background-color: #5a9dae;
}

.table-row:hover .levelPicker .select-component-container label::after {
    display: none;
}

.table-selectable .table-body > .table-row.collapsible-table:hover .select-cancel,
.table-selectable .table-body > .table-row.collapsible-table:hover .select-carret {
    color: #444;
    background-color: inherit;
}

.table-selectable .table-body > .table-row.collapsible-table:hover .component-select-wrapper * {
    color: #444;
}

.table-selectable .table-body > .table-row.collapsible-table:hover .select-cancel,
.table-selectable .table-body > .table-row.collapsible-table:hover .select-carret,
.table-row:hover .levelPicker .select-component-container > input {
    color: #fff;
}

/* .expandable-row .row-wrapper > div input::-webkit-input-placeholder,
.inputSearchColumn *::-webkit-input-placeholder,
.postesColumn *::-webkit-input-placeholder,
.inputColumnInput *::-webkit-input-placeholder {
    color: #222;
    opacity: .2;
}

.expandable-row .row-wrapper > div input::-moz-placeholder,
.inputSearchColumn *::-moz-placeholder,
.postesColumn *::-moz-placeholder,
.inputColumnInput *::-moz-placeholder {
    color: #222;
    opacity: .2;
}

.expandable-row .row-wrapper > div input:-ms-input-placeholder,
.inputSearchColumn *:-ms-input-placeholder,
.postesColumn *:-ms-input-placeholder,
.inputColumnInput *:-ms-input-placeholder {
    color: #222;
    opacity: .2;
}

.expandable-row:hover .row-wrapper > *::-webkit-input-placeholder,
.expandable-row:hover .row-wrapper > *::-moz-placeholder,
.expandable-row:hover .row-wrapper > *:-ms-input-placeholder {
    color: #fff;
}

form.table-row > .inputSearchColumn {
    width: 76%;
}

form.table-row > .postesColumn {
    width: 78%;
    padding-left: 18px;
    margin: 0;
}

form.table-row > .postesColumn input {
    height: 27px;
    border: none;
}

form.table-row .postesColumn > div {
    display: inline-block;
    height: 30px;
}

form.table-row .postesColumn > div:first-child {
    width: 26%;
}

.inputSearchColumn > input {
    width: 100%;
    height: 26px;
    margin: 0;
    border: none;
    outline: none;
} */

/* Color Picker */
.colorPicker-container {
    position: relative;
    float: left;
    width: 15px;
    height: 15px;
    margin-right: 5px;
    margin-bottom: 5px;
    cursor: pointer;
    box-shadow: inset 0 0 0 1px #ddd;
}

.dot-box {
    position: absolute;
    top: 5px;
    right: 5px;
    bottom: 5px;
    left: 5px;
    background: #fff;
    border-radius: 50%;

    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.colorPicker-wrapper {
    width: 100%;
    min-height: 1px;
    overflow: visible;
}

.colorPicker-wrapper label {
    top: 4px;
    font-size: 14px;
    color: #5a9dae;
    visibility: visible;
}

.colorPicker-current-color {
    padding: 5px;
    cursor: pointer;
    background: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
}

.current-color-cell {
    width: 36px;
    height: 14px;
    border: 1px solid transparent;
}

.colorPicker-main {
    position: absolute;
    top: 25px;
    left: 50px;
    z-index: 2;
    width: 240px;
    padding-top: 5px;
    padding-left: 5px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .12), 0 2px 5px rgba(0, 0, 0, .16);
}

.cover {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
}

.picker-div {
    position: relative;
    z-index: 3;
}

.picker-no-color {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    /* font: normal 100%/normal Arial, Helvetica, sans-serif; */
    color: rgba(255, 255, 255, 1);
    text-overflow: clip;
    background: -webkit-linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), -webkit-linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), rgb(255, 255, 255);
    background: -moz-linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), -moz-linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), rgb(255, 255, 255);
    background: linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), linear-gradient(45deg, rgba(0, 0, 0, .0980392) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, .0980392) 75%, rgba(0, 0, 0, .0980392) 0), rgb(255, 255, 255);
    background-position: 0 0, 4px 4px;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    background-origin: padding-box;
    -webkit-background-size: 8px 8px;
    background-size: 8px 8px;
    border: 1px solid #ccc;

    -o-text-overflow: clip;
    -webkit-background-origin: padding-box;
}

.inputColumnInput > div {
    float: right;
    width: 32px;
    height: 30px;
    margin-right: 2px;
    font-size: 20px;
    text-align: center;
    cursor: pointer;
}

.inputColumnInput > div.mdi-navigation-close::before {
    position: relative;
    top: 5px;
}

#gradientBox {
    position: absolute;
    top: 15px;
    left: 15px;
    width: 256px;
    height: 256px;
    padding: 0;
    overflow: hidden;
    cursor: crosshair;
}

#hueBarDiv {
    position: absolute;
    top: 15px;
    left: 310px;
    width: 35px;
    height: 256px;
}

#color-picker-container {
    position: relative;
    left: 80px;
    width: 531px;
    height: 290px;
    margin: auto auto 2em auto;
    color: #fff;
    background-color: #333;
}

#color-picker-container input[type="text"] {
    min-width: 65px;
    padding-left: 5px;
    margin: auto;
    color: #ccc;
    background-color: #666;
    border: 1px solid #222;
}

#color-picker-container input[type="text"]:focus {
    box-shadow: none;
}

#color-screen {
    position: relative;
    display: inline-block;
    width: 145px;
    height: 50px;
    margin-bottom: 1em;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
}

#input-box {
    position: absolute;
    top: 15px;
    left: 370px;
    width: 145px;
    height: 256px;
}

#hueBarDiv > #bar {
    position: absolute;
    left: 8px;
    width: 19px;
    height: 256px;
    padding: 0;
}

#hueBarDiv > #arrows {
    position: absolute;
    left: 0;
    width: 35px;
    height: 9px;
}

#quickColor {
    position: absolute;
    top: 0;
    left: 0;
    width: 73px;
    height: 50px;
}

#staticColor {
    position: absolute;
    top: 0;
    left: 73px;
    width: 72px;
    height: 50px;
}

#color-picker-container .input-container {
    display: block;
}

#color-picker-submit {
    margin-top: 6em;
}

.network-input-container.card {
    overflow: visible;
}

#color-picker-container #arrows {
    cursor: pointer;
}

.table-header {
    font-family: "Myriad Pro Bold", Helvetica, sans-serif;
    color: #b1b3b4;
}

.table-header,
.table-body {
    width: calc(100% + 15px);
    padding: 0;
}

.listCard-header::before {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 6px;
    margin-left: 1em;
    content: " ";
    background-color: #779fa6;
}

.listCard-header {
    font-family: "Myriad Pro Bold", Helvetica, sans-serif;
    position: relative;
}

.fieldCard-container .listCard-header::before {
    margin-left: 0;
}

.table-body > .table-row,
.table-header > .table-row {
    margin: 0;
}

.table-header > .table-row {
    border-bottom: 1px solid #c6c7c8;
}

.table-header + .table-body > .table-row {
    border-bottom: 1px solid #c6c7c8;
}

.table-selectable .table-body {
    position: relative;
}

.table-row-2Lines > div {
    min-height: 0px;
    vertical-align: bottom;
}

article.card > .table-header,
article.card > .table-body {
    margin: 0;
}

article.card > * {
    clear: both;
}

article.card .mdi-content-add-circle {
    display: none;
    float: right;
    height: 49px;
    margin-right: 15px;
    font-size: 35px;
    color: #779fa6;
    cursor: pointer;
}

article.card .mdi-content-add-circle.active {
    display: block;
    transition: display .4s ease;
}

/* powermap */
.map-settings .input-container .map-input-wrapper {
    display: inline-block;
    padding: 0;
    margin-right: 15px;
}

[type="radio"]:not(:checked) + label.map-input-label, [type="radio"]:checked + label.map-input-label {
    padding-left: 25px;
}

.hitBox {
    cursor: pointer;
}

.powermap-involvement-wrapper:hover .hitBox,
.hitBox:hover {
    opacity: .08;
}

.hitBox.active {
    opacity: .4;

    stroke: #000;
}

.popupRelation-container {
    z-index: 4;
    box-sizing: border-box;
    margin: 8px;
    background-color: #fff;
}

.popupRelation-container .input-wrapper .textfield__label:after {
    bottom: 0;
}

.popupRelation-container .input-wrapper .textfield__label {
    top: 5px;
    height: 25px;
}

.popupRelation-container .input-wrapper {
    top: -4px;
    min-height: 30px;
    padding: 0;
}

.popupRelation-container .involvement-icons-wrapper.open {
    position: relative;
    right: 1px;
}

.popupRelation-container .involvement-icons-wrapper.delete {
    position: relative;
    left: 2px;
}

.popupRelation-container .sub-container {
    /* z-index: 4; */
    display: inline-block;
    /* min-width: 24px; */
    /* margin: 0 3px 0 3px; */
    /* padding: 2px 0; */
    /* vertical-align: top; */
}

.matrix-container .popupRelation-container .sub-container {
    min-width: 54px;
}

.popupRelation-container .sub-container .select-component-container {
    top: 0;
    height: 20px;
    padding: 0 5px;
    border: 1px solid #444;
    /* width: 100%; */
    font-size: 13px;
}

#graphContainer.graphContainerMatrix + span .popupRelation-container .sub-container .select-component-container {
    width: auto;
}

.popupRelation-container .sub-container .select-component-container span:first-child {
    position: relative;
    top: 0;
}

.popupRelation-container .sub-container .select-component-container span.select-cancel {
    top: -1px;
}

.popupRelation-container .sub-container .select-component-container span.select-carret {
    top: -1px;
}

.popupRelation-container .sub-container .colorPicker-wrapper .colorPicker-current-color {
    border-bottom: none;
}

.popupRelation-container .sub-container .powerscope-icons {
    cursor: pointer;
}

.collapsible-header i,
.icons {
    width: 1em;
    height: 99%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 85%;
}

/* -- Structurogramme */
.close-button,
.graphNode-background {
    cursor: pointer;
}

.graphNode-inclination--label {
    font-size: 10px;
}

.graphNode--down-arrow {
    font-size: 12px;
}

.graphNode--title {
    font-size: 12px;
    font-weight: bold;
}

.graphNode--subTitle {
    font-size: 10px;
    font-style: italic;
}

.graphNode-wrapper .graphNode--title,
.graphNode-wrapper .graphNode--subTitle {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari*/
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* version non-prefixé, non supporté par chrome et opera pour l'instant */
    cursor: pointer;
}

.chartRelation--hitBox {
    opacity: 0;
    cursor: pointer;
}

.chartRelation--hitBox:hover {
    opacity: 0.4;
    transition: opacity 0.2s ease;
}

/* -- // -- */

/* -- Organismes -- */

#organization-container {
    margin-top: 1em;
}

#organization-container .input-container > div {
    display: inline-block;
    float: none;
    vertical-align: top;
}

/* -- */
.icon-contact {
    background-image: url('../img/ico/contact.svg');
}

.icon-entite {
    background-image: url('../img/ico/entite.svg');
}

.entity-item > ul > li > span.carret {
    border-left: 5px solid #fff;
}

.entity-item > span {
    padding-left: 7px;
    cursor: pointer;
}

.entity-item > span:hover {
    color: #fff;
    background-color: #5a9dae;
}

.letter-content span.s6.user {
    display: inline-block;
    width: 55%;
    box-sizing: border-box;
}

.sheet-item span.s6.user {
    display: inline-block;
    width: 55%;
    box-sizing: border-box;
    margin-right: 3%;
}

.letter-content span.s6.society {
    display: inline-block;
    width: 42%;
}

.sheet-item span.s6.society {
    display: inline-block;
    width: 42%;
}

.entity-name.carret::before {
    position: absolute;
    top: 12px;
    left: -12px;
    display: inline-block;
    margin-right: 12px;
    content: '';
    border-top: 6px solid #000;
    border-right: 6px dotted transparent;
    border-bottom: none;
    border-left: 6px solid transparent;
    -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */
    -ms-transform: rotate(-180deg); /* IE 9 */
    transform: rotate(-180deg);
}

.entity-item {
    padding-left: 1.5em;
}

.entity-name.carret.active::before {
    -webkit-transform: rotate(0deg); /* Chrome, Safari, Opera */
    -ms-transform: rotate(0deg); /* IE 9 */
    transform: rotate(0deg);
}

.entity-name {
    display: block;
    height: 100%;
}

.table-row .table-dropdown textarea {
    width: 98%;
    margin: auto 0;
    border: 1px solid transparent;
}

.table-row .table-dropdown textarea:focus {
    padding-left: 8px;
    -webkit-transition: padding .3s ease;
    -ms-transition: padding .3s ease;
    -o-transition: padding .3s ease;
    transition: padding .3s ease;
}

.table-row .table-dropdown textarea:focus,
.table-row .table-dropdown textarea:hover {
    border: 1px solid #ccc;
}

.table-row input[type="text"].input-table {
    height: 1.01em;
    padding: 3px 2px 4px;
    margin: 5px 0;
    background-color: transparent;
    border: 1px solid transparent;
}

.table-row input[type="text"].input-table:focus {
    padding-left: 8px;
    border: 1px solid #ccc;
    -webkit-transition: padding .3s ease;
    -ms-transition: padding .3s ease;
    -o-transition: padding .3s ease;
    transition: padding .3s ease;
}

.table-row:hover input[type="text"].input-table:focus,
.table-row.active input[type="text"].input-table:focus {
    padding-left: 8px;
    border: 1px solid #fff;
}

.table-row input[type="text"].input-table:focus:not([readonly]) {
    box-shadow: none;
}

.table-row .editable:hover input[type="text"].input-table {
    border: 1px solid #fff;
}

.table-row .table-dropdown .editable:hover input[type="text"].input-table {
    width: 90%;
    border: 1px solid #ccc;
}

.table-row .table-arrow {
    top: 1px;
    left: -15px;
    width: 24px;
    height: 24px;
    margin-left: 6px;
    background-image: url("../img/ico/arrow.svg");
    background-size: cover;
}

.table-no-arrow {
    position: absolute;
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-left: 6px;
    background-color: transparent;
}

.table-td {
    margin: 5px 0;
}

/* --  Table -- */
.table-arrow {
    width: 32px;
    height: 32px;
    background-image: url(../img/ico/arrow.svg);
    background-size: cover;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.table-arrow.active:not(.table-arrow:hover) {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.table-config-button-wrapper {
    position: relative;
    text-align: right;
}

.table-config-button-wrapper > div,
.rowSettingList-wrapper > div {
    float: right;
}

.table-config-button {
    position: relative;
    width: 32px;
    height: 35px;
    font-size: 20px;
    color: #444;
    text-align: center;
    cursor: pointer;
}

#root .rowSetting-wrapper,
#root .cardFormClose {
    float: right;
    max-width: 180px;
}

/* CardForm */
.formContainer .textfield__label {
    top: 6px;
    padding-left: 4px;
    font-size: 14px;
}

.formContainer .textfield__input {
    height: 30px;
    padding: 0;
    border-bottom: none;
}

.rowSetting-wrapper > div {
    position: relative;
    width: 35px;
    height: 30px;
    font-size: 22px;
    text-align: right;
}

.rowSetting-wrapper > div.icn-menu-settings > i {
    width: 35px;
    height: 30px;
    padding-top: 3px;
    font-size: 23px;
    text-align: center;
}

.navbar-item.icn-settings > i {
    position: relative;
    top: -4px;
}

.sub-nav .icn-menu-settings > i {
    position: relative;
    top: 7px;
    width: 42px;
    text-align: center;
}

.rowSetting-wrapper > div .settings-wrapper {
    font-size: 16px;
}

.table-row:hover .table-config-button,
.table-row.active .table-config-button {
    color: #fff;
}

.table-config-button:hover {
    background-color: rgba(0, 0, 0, .1);
}

.table-row:hover .table-arrow {
    cursor: pointer;
    background-repeat: no-repeat;
    outline: 1px solid transparent;
    -webkit-transition: transform .2s ease;
    -ms-transition: transform .2s ease;
    transition: transform .2s ease;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);

    -webkit-backface-visibility: hidden;
}

.table-row.active .table-arrow {
    outline: 1px solid transparent;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);

    -webkit-backface-visibility: hidden;
}

.table-row:hover .table-dropdown,
.table-row.active .table-dropdown {
    color: #000;
}

table.table-card th {
    padding-left: 0;
}

table.table-card td input {
    margin: 0;
    background-color: transparent;
    border: none;
}

table.table-card td input[type="text"]:focus:not([readonly]) {
    border-bottom: none;
    box-shadow: none;
}

table.table-card tr {
    border-top: 1px solid #d0d0d0;
}

table.table-card tr:first-child {
    border-top: none;
}

.card.dropzone,
.dropzone {
    position: relative;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .14), 0 4px 2px -3px rgba(0, 0, 0, .2), 0 2px 6px 0 rgba(0, 0, 0, .12);
}

.dropzone .listCard-container {
    box-shadow: none;
}

.table-row:hover > span:first-child,
.table-row.active > span:first-child {
    color: #fff;
    background-color: #5a9dae;
}

.table-row.active .table-row-content-wrapper {
    border: 1px solid #000;
}

/* Confirmation Popup */
.confirmationPopup--wrapper {
    background-color: rgba(0, 0, 0, .3);
}

.confirmationPopup--wrapper.cover {
    z-index: 6;
    cursor: default;
}

.confirmationPopup--wrapper .confirmation--container {
    position: relative;
    width: 40em;
    min-height: 10em;
    margin: 20% auto;
    background-color: #fff;
}

.confirmationPopup--wrapper .message--wrapper {
    padding: 1.6em;
    text-align: center;
}

.confirmation--button-wrapper .confirmation--button-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
    margin: auto;

    align-items: center;
    justify-content: space-around;
}

.confirmation--button-wrapper {
    bottom: 0;
    padding-bottom: 2em;
}

/* individual: webkit */
.table-row.add-box input::-webkit-input-placeholder {
    font-size: 16px;
    color: #444;
}

.table-row.add-box:hover input::-webkit-input-placeholder {
    font-size: 16px;
    color: #fff;
    opacity: 1;
}

/* individual: mozilla */
.table-row.add-box input::-moz-placeholder {
    font-size: 16px;
    color: #444;
}

.table-row.add-box:hover input::-moz-placeholder {
    font-size: 16px;
    color: #fff;
    opacity: 1;
}

.table-dropdown {
    display: block;
    float: none;
    height: 0;
    padding: 0 15px;
    color: #000;
    background-color: #fff;
    -webkit-transition: transform .2s ease;
    -ms-transition: transform .2s ease;
    transition: transform .2s ease;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 100%;
}

.table-dropdown > * {
    display: none;
}

.table-dropdown.active {
    display: block;
    height: auto;
    margin-top: 5px;
    -webkit-transition: transform .3s ease;
    -ms-transition: transform .3s ease;
    transition: transform .3s ease;
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 50% 0;
}

.table-dropdown.active > * {
    display: block;
}

/* --- end table--- */
.table-selectable.postes .table-body > div {
    padding: 0;
}

.table-arrow-wrapper {
    padding: 0;
}

/*.table */
.table-row.expandable-row {
    padding: 0;
}

.expandable-row .row-wrapper > div {
    display: inline-block;
    vertical-align: top;
}

.expandable-row .row-wrapper > div input {
    padding: 4px 0 0;
    line-height: 20px;
    background-color: transparent;
    border: none;
}

.expandable-row:hover .row-wrapper > div input {
    color: #fff;
}

.table-row > div.expandable-wrapper {
    display: block;
    width: 100%;
    height: auto;
    padding: 0 29px;
    color: #222;
    background-color: #fff;
}

.expandable-content {
    position: relative;
    display: block;
    padding-bottom: 16px;
}

.expandable-title {
    display: block;
    font-weight: bold;
}

.arrow-item-wrapper {
    display: inline-block;
    width: 15px;
    max-width: 18px;
}

.table-row.expandable-wrapper.active,
.expandable-row.active,
.expandable-row.active .expandable-wrapper,
.expandable-row.active .arrow-item-wrapper {
    height: auto;
    transition: height .4s ease;
}

.expandable-row.active .expandable-wrapper * {
    color: #222;
}

#poste-header-space {
    width: 18px;
}

#organization-container .input-wrapper > input[type="text"],
#organization-container .input-wrapper > textarea {
    margin: 11px 0;
}

.organismes-content {
    padding: 0;
}

.organismes-content > li {
    border-bottom: 1px solid #888;
}

.organismes-container {
    padding: 0;
}

.organismes-content > li > * {
    display: block;
    padding: 0 15px;
    color: #000;
    cursor: pointer;
}

.organismes-content {
    max-height: 15em;
    overflow-y: scroll;
}

#organism-container .input-wrapper > input[type="text"],
#organism-container .input-wrapper > textarea {
    margin: 11px 0;
}

.organism-content {
    padding: 0;
}

.organism-content > li {
    width: 100%;
    border-bottom: 1px solid #888;
}

.organism-container {
    padding: 0;
}

.organism-content > li > * {
    display: block;
    padding: 0 15px;
    color: #000;
    cursor: pointer;
}

.organism-content {
    max-height: 15em;
    overflow-y: scroll;
}

/* delet */
#onglet-wrapper.menu-compressed,
#app-content.menu-compressed {
    width: auto;
    margin-left: 299px;
    -webkit-transition: margin .1s ease;
    -ms-transition: margin .1s ease;
    transition: margin .1s ease;
}

.content-compressed {
    width: auto;
    margin-left: 301px;
    -webkit-transition: margin .1s ease;
    -ms-transition: margin .1s ease;
    transition: margin .1s ease;
}

#onglet-wrapper,
#app-content {
    -webkit-transition: margin .2s ease;
    -ms-transition: margin .2s ease;
    transition: margin .2s ease;
}

.navigator-wrapper > div.fixedPosition {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    display: block;
    width: 300px;
}

.navigator-header > i {
    margin: 12px;
}

.navigator-header {
    width: 300px;
    height: 3rem;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .07), 0 3px 1px -2px rgba(0, 0, 0, .1), 0 1px 5px 0 rgba(0, 0, 0, .06);
}

.navigator-header:hover {
    background-color: rgba(0, 0, 0, .1);
}

#navigator-wrapper .navigator-header-wrapper {
    display: block;
    background-color: #779fa6;
    border-right: 1px solid rgba(0, 0, 0, .1);
}

#navigator-wrapper .navigator-header {
    cursor: pointer;
}

#navigator-wrapper .navigator-header .powerscope-icons {
    color: #fff;
}

#navigator-wrapper .navigator-header:hover {
    background-color: rgba(0, 0, 0, .1);
}

.navsection-header-rightIcon {
    position: absolute;
    top: 0;
    right: 6px;
    z-index: 1;
    height: 47px;
    padding: 0 8px;
    color: #fff;
    vertical-align: middle;
    cursor: pointer;
}

.navsection-header-rightIcon:hover {
    background-color: rgba(0, 0, 0, .1);
}

.navsection-header-rightIcon > i {
    margin-top: 7px;
    font-size: 32px;
}

.navsection-header-wrapper {
    position: relative;
    display: block;
}

.navsection-header .powerscope-icons {
    position: relative;
    top: -3px;
    margin-right: 16px;
    font-size: 30px;
    vertical-align: middle;
}

.navsection-row-wrapper > .navsection-list-item {
    border-top: 1px solid #ccc;
}

.navsection-row-wrapper > .navsection-list-item:last-child {
    border-bottom: 1px solid #ccc;
}

.navsection-wrapper {
    position: relative;
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.truncateOn2Lines {
    overflow: hidden;
    text-overflow: ellipsis;
}

#root #fullPageMenu.sub-nav > .itemNodesContainer {
    width: calc(100% - 0px);
}

/* HomePage */
.card-header::before {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 6px;
    content: " ";
    background-color: #779fa6;
}

.card-header {
    margin: 8px 0;
}

.card-header,
.card-content,
.card-footer,
.action-bar {
    width: calc(100% - 0px);
    box-sizing: border-box;
    padding: 0 16px;
}

.card-footer,
.action-bar {
    min-height: 1em;

    -webkit-align-self: flex-end;
    -ms-flex-item-align: flex-end;
    align-self: flex-end;
}

.card-footer .powerscope-icons,
.action-bar .powerscope-icons {
    position: relative;
    margin: 8px 5px 0 0;
    font-size: 32px;
    color: #779fa6;
    cursor: pointer;
}

.action-bar {
    padding: 0;
    text-align: right;
}

*.unselectable {
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: -moz-none;
    -ms-user-select: none;
    user-select: none;

    -khtml-user-select: none;
}

.graph-menu-container > div,
.powermap-container {
    background-color: #fff;
}

.powermap-container.active {
    width: calc(96% - 16px);
}

.powermap-editBox {
    cursor: pointer;
}

#svg-wrapper {
    position: relative;
}

#svg-wrapper {
    height: 100vh;
    max-height: calc(100vh - 145px) !important;
    margin: 0;
}

#svg-wrapper > .pws_loader {
    margin: auto;
    padding: 16em;
}

#graphContainer {
    height: 100vh;
    max-height: calc(100vh - 145px) !important;
    margin: 0;
}

#graphContainer.graphContainerMatrix {
    max-height: none !important;
    height: auto;
}

#svg-wrapper {
    width: calc(100% - 0px);
}

#svg-wrapper.organizationalChart-wrapper > #graphContainer {
    max-height: none !important;
}

.organizationalChart-wrapper #graphContainer {
    height: auto;
}

.graph-menu-container .selectfield label {
    display: block;
    font-size: 12px;
}

.graph-menu-container .selectfield select {
    width: 95%;
}

.graph-menu-container.retracted .graph-menu-content {
    display: none;
}

.graph-menu-container .graph-menu-sideButton {
    position: relative;
    display: inline-block;
    width: 7%;
    vertical-align: middle;
    cursor: pointer;
}

.graph-menu-container .graph-menu-sideButton:hover {
    background-color: rgba(0, 0, 0, .05);
    transition: background .2s ease;
}

.graph-menu-container .graph-menu-sideButton .powerscope-icons {
    position: relative;
    top: 50%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; /*Fix microsoft*/
    font-size: 26px;
    color: #ccc;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);

    -webkit-align-self: center;
    -ms-align-self: center;
    -o-align-self: center;
    align-self: center;
}

.graph-menu-container .graph-menu-sideButton:hover .powerscope-icons {
    color: #999;
}

.graph-menu-container .graph-menu-content {
    display: inline-block;
    width: 87%;
    padding-top: 1em;
    /* padding-left: 12px; */
    vertical-align: top;
}

.graph-menu-container {
    width: calc(100% - 0px);
    padding: 0;
    margin: 0;
    background-color: #fff;
}

.graph-menu-container.active {
    left: 0;
}

.graph-menu-container.retracted {
    width: 100%;
}

.graph-menu-container.retracted .graph-menu-sideButton,
.graph-menu-container.retracted > span {
    width: 100%;
    margin: 0;
}

.graph-menu-container .graph-menu-sideButton .powerscope-icons {
    right: 3px;
}

.graph-menu-container.retracted .graph-menu-sideButton .powerscope-icons {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.graph-menu-container .field-container .btn-raised.btn-raised.active {
    background-color: rgb(149, 189, 196);
    box-shadow: none;
    transition: box-shadow .2s ease;
}

.graph-menu-container > span {
    position: relative;
    /* display: block; */
    display: flex;
    width: 100%;
}

.graph-menu-container .select-component-container.select-type {
    width: 95%;
    height: 22px;
    cursor: pointer;
    border: 1px solid #444;
}

.graph-menu-container .select-component-container.select-type .select-carret {
    top: 0;
    height: 22px;
}

.graph-menu-container .select-component-container.select-type span:first-child {
    display: block;
    width: 100%;
    height: 100%;
}

.graph-menu-container .select-component-container.select-type .option-wrapper {
    top: 23px;
}

.graph-menu-container .select-component-container.input-type .textfield__label::after {
    bottom: 0;
}

.graph-menu-container .select-component-container.input-type .select-carret {
    top: 0;
    right: 7px;
}

.graph-menu-container .select-component-container.input-type .select-carret + span {
    bottom: inherit;
}

.graph-menu-content .select-component-container.input-type {
    width: 99%;
}

.graph-menu-container .select-component-container.input-type .textfield__label {
    top: 0;
}

.graph-menu-container .select-component-container.input-type .floating-label.is-focused .textfield__label {
    top: -16px;
}

.graph-menu-container .select-component-container.input-type {
    margin-bottom: 2em;
}

.graph-menu-container .select-component-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;

    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
}

.graph-main {
    width: calc(96% - 16px);
}

.graph-side {
    width: calc(4% - 16px);
}

.powermap-involvement-borderText {
    cursor: pointer;
}

.popup-container {
    position: fixed;
    z-index: 999;
    padding: 8px;
    background-color: #fff;
}

.involvement-link {
    cursor: pointer;
}

#svg-wrapper * {
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE/Edge */
    user-select: none;
    /* non-prefixed version, currently
                                  not supported by any browser */

    -webkit-touch-callout: none; /* iOS Safari */
    -khtml-user-select: none; /* Konqueror */
}

.svg-icons-wrapper {
    pointer-events: all;
    cursor: pointer;

    fill: transparent;
}

.svg-icons {
    fill: #000;
}

.svg-icons-wrapper:hover .svg-icons {
    fill: #5a9dae;
}

.matrix-label {
    font-size: 13px;
    font-family: Myriad Pro Regular, Helvetica, sans-serif;
    cursor: pointer;
}

/* OrganizationaleChart */
.organizationalChart-wrapper {
    background-color: #FFFFFF;
    overflow: auto !important;
}

/* Involvement */
.powermap-involvement-wrapper {
    cursor: move;
}

/* Scroolbar Fix**/
#navigator {
    display: block;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.fullPage-table-wrapper .fullPage-table-content.gm-scrollbar-container {
    max-height: 65vh;
    overflow-y: scroll;
}

/** Loader **/
.pws_loader {
    position: relative;
    width: 200px;
    margin: 30vh auto;
    text-align: center;
}

.lodaer_wrapper {
    position: relative;
    width: 60px;
    margin-left: auto;
}

.pws_loader .loader_message {
    width: 100%;
    color: #ccc;
    text-align: center;
}

.svg-hitbox {
    cursor: pointer;
}

/* .matrix-select-wrapper {
    position: fixed;
    width: 200px;
    background-color: #fff;
}

.matrix-select-wrapper .textfield__label {
    top: 3px;
}

.matrix-select-wrapper .textfield__label::after {
    bottom: 0;
} */

/** salesforce logo **/
.cardSideLogo {
    position: absolute;
    top: -10px;
    right: 0;
    z-index: 99;
    font-size: 3em;
    color: #00a1e0;
}

/** Helper classes **/
.hidden {
    display: none !important;
}

.visuallyhidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    border: 0;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    display: table; /* 2 */
    content: " "; /* 1 */
}

.clearfix:after {
    clear: both;
}

#root input::-ms-clear {
    display: none; /*Fix Microsoft Edge*/
}

/** TOOLTIP **/
.tooltip-container {
    position: relative;
    bottom: 24px;
}

.pws-tooltip--message {
    padding: 4px;
    font-size: 10px;
    color: #fff;
    background-color: rgba(0, 0, 0, .6);
    border-radius: 4px;
    opacity: 0;
}

.pws-tooltip--message.active {
    opacity: 1;
    transition: opacity .2s ease;
}

/**  Loader **/
.profile-main-loader .loader {
    position: relative;
    width: 45px;
    margin: 0 auto;
}

.profile-main-loader .loader:before {
    display: block;
    padding-top: 100%;
    content: '';
}

.circular-loader {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: auto;
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation: rotate 2s linear infinite;
    animation: rotate 2s linear infinite;
}

.loader-path {
    -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
    animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;

    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    stroke-linecap: round;
}

/** Popup salesforce_export **/
body.salesforce_export {
    background-color: #f8f8f8;
}

.salesforce_export-content-container {
    position: relative;
    width: 300px;
    min-height: 100px;
    padding: 32px 16px;
    margin: 4em auto auto;
    background-color: #fff;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
}

.salesforce_export-popup-close-icon {
    position: relative;
    top: -7px;
    display: block;
    font-size: 1.75em;
    color: #000;
    text-decoration: none;
}

.salesforce_export-message-wrapper {
    padding: 8px;
}

.salesforce_export-close-icon-wrapper {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 50%;
}

.salesforce_export-close-icon-wrapper:hover {
    background-color: rgba(0, 0, 0, .1);
}

.salesforce_export-support-link {
    color: #5a9dae;
}

.salesforce-button-wrapper {
    position: relative;
    width: 100%;
    margin-top: 1em;
    text-align: center;
}

/** HOME PAGE **/
.home-container .message-circle {
    position: relative;
    width: 34em;
    height: 34em;
    padding: 4em;
    margin: 3em auto;
    color: #676767;
    background-color: #fdfdfd;
    border-radius: 50%;
}

.home-container .message-container {
    line-height: unset;
    padding: 1em 3em;
    text-align: justify;
}

.home-container .icon-wrapper {
    position: relative;
    width: 100%;
}

.home-container .powerscope-icons {
    position: relative;
    display: block;
    width: 100%;
    margin-bottom: .5em;
    font-size: 10em;
    color: #ddd;
    text-align: center;
}

.home-container a {
    color: #5a9dae;
}

.formContainer .component-select-option-wrapper {
    max-width: 1200px;
}

.component-datalist-options-wrapper {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    display: flex;
    flex-direction: column;
    position: absolute;
    z-index: 999;
}

.matrixMessageContainer {
    color: #676767;
    padding: 1em 3em;
    text-align: justify;
    align-items: center;
    display: flex;
    justify-content: center;
    height: 100%;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }
    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35;
    }
    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124;
    }
}

@-webkit-keyframes color {
    100%, 0% {
        stroke: #ccc;
    }
    40% {
        stroke: #ccc;
    }
    66% {
        stroke: #ccc;
    }
    80%, 90% {
        stroke: #ccc;
    }
}

@keyframes color {
    100%, 0% {
        stroke: #ccc;
    }
    40% {
        stroke: #ccc;
    }
    66% {
        stroke: #ccc;
    }
    80%, 90% {
        stroke: #ccc;
    }
}

input, *:focus {
    outline: none;
}

:focus {
    outline: none;
}

/*///////////////////////////////////////  MEDIA QUERIES  //////////////////////////////////////*/
/* Screen */
@media screen and (min-width: 1200px) and (orientation: portrait) {
    #svg-wrapper,
    #graphContainer {
        max-height: calc(100vh - 145px) !important;
    }
}

@media screen and (min-width: 1200px) {
    .graph-menu-container .graph-menu-sideButton,
    .graph-menu-container.retracted .graph-menu-sideButton {
        height: calc(100vh - 145px);
    }
}

@media screen and (min-width: 951px) and (max-width: 1199px) {
    .content-compressed {
        margin-left: 0;
    }

    .content-compressed .sub-nav {
        width: calc(100% - 29px);
    }

    .graph-menu-container .selectfield label {
        font-size: 12px;
    }

    .graph-menu-container .selectfield select {
        width: 95%;
    }
}

@media screen and (min-width: 1025px) and (max-width: 1199px) {
    .graph-menu-container .graph-menu-sideButton,
    .graph-menu-container.retracted .graph-menu-sideButton {
        height: calc(100vh - 145px);
    }
}

@media screen and (min-width: 951px) and (max-width: 1024px) {
    .graph-menu-container .graph-menu-sideButton,
    .graph-menu-container.retracted .graph-menu-sideButton {
        height: calc(100vh - 145px);
    }

    .sub-nav {
        width: calc(100% - 29px);
    }

    .content-compressed .sub-nav {
        width: calc(100% - 29px);
    }
}

@media screen and (max-width: 950px) {
    #root .app-content > section {
        width: calc(100% - 0px);
        margin-bottom: 1em;
    }

    #root .itemNodesContainer .menuItemTitle {
        display: none;
    }

    #root .sub-nav .sub-nav-item .icn {
        bottom: 0;
    }

    #root .sub-nav .sub-nav-item {
        width: calc(55px - 0px);
        flex: none;
    }

    #profilePicture {
        font-size: 24vw;
    }

    #svg-wrapper, .graph-menu-container {
        width: calc(100% - 0px);
    }

    .content-compressed {
        margin-left: 0;
    }

    /* .graph-menu-container .graph-menu-sideButton {
        display: none;
    } */

    .graph-menu-container .selectfield select,
    .graph-menu-container .graph-menu-content {
        width: calc(100% - 11px);
    }

    .graph-menu-container .selectfield select,
    .graph-menu-container .graph-menu-content {
        max-width: 350px;
    }

    .subNav-wrapper .sub-nav {
        width: calc(100% - 2em);
    }

    .graph-menu-container .graph-menu-sideButton {
        height: -webkit-calc(100vh - 15vh);
        height: calc(100vh - 15vh);
    }

    .navigator-header {
        width: 50px;
    }

    #navigator-wrapper .navigator-header {
        width: 100%;
    }

    #svg-wrapper {
        min-height: 30em;
    }

    .formContainer .component-select-option-wrapper {
        min-width: 380px;
    }
}

@media screen and (max-width: 849px) {
    .content-compressed {
        margin-left: 0;
    }

    #root .itemNodesContainer {
        width: calc(100% - 50px);
    }

    #root .itemNodesContainer .itemNodesContainer {
        width: calc(70% - 0px);
    }

    #root .menuItemLabel {
        width: calc(30% - 0px);
    }

    #svg-wrapper {
        min-height: 18em;
    }

    .home-container .message-circle {
        width: 24em;
        height: 24em;
        padding: 2em;
        margin: 2em auto;
    }

    .home-container .message-container {
        padding: 0 3em;
    }

    .home-container .powerscope-icons {
        margin-bottom: .5em;
        font-size: 6em;
    }
}

/* Ipad Portrait and Screen */
@media screen and (min-width: 768px) and (max-width: 849px) {
}

/* Iphone Plump LandScape and Screen */
@media screen and (min-width: 736px) and (max-width: 767px) {
    #profilePicture {
        font-size: 32vw;
    }
}

/* Iphone 6 LandScape and Screen */
@media screen and (min-width: 667px) and (max-width: 735px) {
    #profilePicture {
        font-size: 42vw;
    }

    .navsection-list {
        padding: 0;
    }
}

/* Fix Navigator screen transition */
@media screen and (min-width: 600px) and (max-width: 900px) {
}

/* Nexus4 LandScape and Screen */
@media screen and (min-width: 600px) and (max-width: 666px) {
    #profilePicture {
        font-size: 48vw;
    }

    .navsection-list {
        padding: 0;
    }
}

/* Fix 600px (Nexus4 LandScape) */
@media screen and (width: 600px) {
    .navsection-list {
        padding: 0;
    }
}

@media screen and (width: 599px) {

    .navsection-list {
        padding: 0;
    }
}

/* Iphone5 LandScape and Screen */
@media screen and (min-width: 568px) and (max-width: 599px) {
    #profilePicture {
        font-size: 50vw;
    }

    .navsection-list {
        padding: 0;
    }
}

@media all and (min-width: 700px) {
    #directReportingBetween .link path {
        stroke-linecap: round;
    }
}

@media all and (max-width: 699px) {
    #directReportingBetween .link path {
        stroke-linecap: butt;
    }
}

/* Iphone6 Plump Portrait and Screen */
@media screen and (min-width: 414px) and (max-width: 567px) {
    #profilePicture {
        font-size: 54vw;
    }

    .navsection-list {
        padding: 0;
    }

    /*//////////////////////////////////////////////////*/
    .app-content .fieldCard-container {
        overflow-x: scroll;
    }

    /* .app-content .fieldCard-container > div:not(.profilePicture-wrapper),
    .app-content .fieldCard-container > header,
    .app-content .fieldCard-container > footer {
        width: 800px;
    } */

    .app-content .fieldCard-container > header.listCard-header.sideLogo {
        width: 100%;
    }

    .action-bar {
        text-align: left;
    }

    /*//////////////////////////////////////////////////*/
}

/* Nexus4 Portrait and Screen */
@media screen and (min-width: 384px) and (max-width: 413px) {
    #profilePicture {
        font-size: 60vw;
    }

    .navsection-list {
        padding: 0;
    }

    /*//////////////////////////////////////////////////*/
    .app-content .fieldCard-container {
        overflow-x: scroll;
    }

    /* .app-content .fieldCard-container > div:not(.profilePicture-wrapper),
    .app-content .fieldCard-container > header,
    .app-content .fieldCard-container > footer {
        width: 800px;
    } */

    .app-content .fieldCard-container > header.listCard-header.sideLogo {
        width: 100%;
    }

    .action-bar {
        text-align: left;
    }

    /*//////////////////////////////////////////////////*/
}

/* Iphone6 Portrait and Screen */
@media screen and (min-width: 375px) and (max-width: 383px) {
    #profilePicture {
        font-size: 80vw;
    }

    .navsection-list {
        padding: 0;
    }

    /*//////////////////////////////////////////////////*/
    .app-content .fieldCard-container {
        overflow-x: scroll;
    }

    /* .app-content .fieldCard-container > div:not(.profilePicture-wrapper),
    .app-content .fieldCard-container > header,
    .app-content .fieldCard-container > footer {
        width: 800px;
    } */

    .app-content .fieldCard-container > header.listCard-header.sideLogo {
        width: 100%;
    }

    .action-bar {
        text-align: left;
    }

    /*//////////////////////////////////////////////////*/
}

/* Iphone5 Portrait - Crappy Android Landscape and Screen */
@media screen and (min-width: 320px) and (max-width: 374px) {
    #profilePicture {
        font-size: 80vw;
    }

    .navsection-list {
        padding: 0;
    }

    /*//////////////////////////////////////////////////*/
    .app-content .fieldCard-container {
        overflow-x: scroll;
    }

    /* .app-content .fieldCard-container > div:not(.profilePicture-wrapper),
    .app-content .fieldCard-container > header,
    .app-content .fieldCard-container > footer {
        width: 800px;
    } */

    .app-content .fieldCard-container > header.listCard-header.sideLogo {
        width: 100%;
    }

    .action-bar {
        text-align: left;
    }

    /*//////////////////////////////////////////////////*/
}

/* Crappy Android Portrait */
@media screen and (max-width: 319px) {
    #profilePicture {
        font-size: 80vw;
    }

    .navsection-list {
        padding: 0;
    }

    /*//////////////////////////////////////////////////*/
    .app-content .fieldCard-container {
        overflow-x: scroll;
    }

    /* .app-content .fieldCard-container > div:not(.profilePicture-wrapper),
    .app-content .fieldCard-container > header,
    .app-content .fieldCard-container > footer {
        width: 800px;
    } */

    .app-content .fieldCard-container > header.listCard-header.sideLogo {
        width: 100%;
    }

    .action-bar {
        text-align: left;
    }

    /*//////////////////////////////////////////////////*/
}

@media print,
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
}

@media print {
    *,
    *:before,
    *:after {
        color: #000 !important;
        /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        text-shadow: none !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;

        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}