* {
    box-sizing: border-box;
}

html {
    background-color: white;
    overflow-y: auto!important;
}

body {
    font-family : "Source Sans Pro";
    font-size: 16px;
    /* min-width: 1200px; */
}

:focus {
    outline: 0!important;
}

span.error {
    color: #ef3e36;
}

span.success {
   color: #39b54a;
}

.spacing-for-md {
    margin-left: 25px;
    margin-right: 25px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    margin-top: 25px;
}

.bootstrap-and-md {
    padding-left: 0px;
    padding-right: 0px;
}

.bootstrap-and-md.one-column-bootstrap-and-md {
    padding-right: 50px;
}

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

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

.application-global-container {
    background-color: inherit;
}

#main-grid {
    padding: 0% 5%;
}

.main-view-container {
    margin-top: 20px;
}

.clickable, [ng-click] {
    cursor:pointer;
}

.no-clickable {
    cursor: default;
}

.no-style-list {
    list-style-type: none;
    padding-left: 5px;
}

.modal-body {
  overflow-y: auto;
}
.modal-body{
}
.modal-body-left {
    margin-left: 60px;
    white-space: nowrap;
}
.modal-body-right {
    border-right: 2px solid #c0c0c0;
    float: left;
    white-space: nowrap;
    overflow: auto;
    margin-right: 8px;
}

.small-modal-footer {
    text-align: right;
    margin-top: 10px;
}

.navbar-custom {
    background-color:#25AAE1;
    color:#ffffff;
    border-radius:0;
    border:0px;
    margin-bottom: 0px;
}

.navbar-custom .navbar-nav > li {
    float: left;
}

.navbar-custom .navbar-nav {
    float: left;
    margin: 0px;
}

.navbar-custom .navbar-nav > li > a {
    padding-top: 8px;
    padding-bottom: 8px;
}

.navbar-custom .navbar-nav > li:not(.disabled) > a {
    color:#fff;
    height: 40px;
}

.navbar-custom .navbar-nav > li.disabled > a {
    height: 39px !important;
}


.navbar-custom .navbar-brand {
    color:#eeeeee;
}

.header-menu {
    font-size : 1.2em;
    padding:0px;
}

.navbar-header {
    padding-top:0px;
    padding-bottom:0px;
    padding-left:0px;
    padding-right:15px;
    margin:0px !important;
}

span.insite-logo {
    display: inline-block;
    width: 85px;
    height: 35px;
    background-position: 50% 100%;
    background-size: contain;
    background-repeat: no-repeat;
}

span.logo {
    background-image: url('../img/Logo_engage.svg');
}

img.home {
    height: 24px;
    padding-bottom:3px;
}

.navbar-custom .navbar-nav > li:not(.disabled) > a:hover, .navbar-custom .navbar-nav > li:not(.disabled) > a:focus {
    height: 40px;
    background-color: #0077AE;
}

.mini-menu.navbar-custom .navbar-nav > li:not(.disabled) > a:hover, .mini-menu.navbar-custom .navbar-nav > li:not(.disabled) > a:focus {
    color: white !important;
}

.navbar-custom .navbar-nav > li.disabled, .navbar-custom .navbar-nav > li.disabled:hover, .navbar-custom .navbar-nav > li.disabled > a:hover, .navbar-custom .navbar-nav > li.disabled > a:focus {
    height: 40px;
    background-color: #e0e0e0;
    color:#777777;
}

.navbar-custom .navbar-nav > li.menu-large {
    min-width:105px;
    text-align:center;
}

.navbar-custom .navbar-nav > li > span.menu-separator {
    display: inline-block;
    height: 20px;
    margin-top: 10px;
    border-left: solid 1px #777777;
}

.navbar-custom .navbar-toggle {
    margin:0px;
}

.navbar-brand {
    background-color: white;
    padding-top:0px;
    padding-bottom:0px;
    height:40px;
}

.navbar-custom {
    min-height: 40px!important;
}

.small-navbar-nav {
    margin:0px !important;
}

.mini-menu .navbar-collapse {
    position: absolute !important;
    right: 15px;
    top:46px;
    background-color:#FFFFFF;
    border: solid 1px #808080 !important;
    z-index:110;
    border-radius: 5px;
    border-top-right-radius: 0px;
    padding: 0px;
    min-width: 200px;
    font-size: 16px;
}

.mini-menu .navbar-nav>li>a {
    color: #000000 !important;
    padding-left: 25px;
    padding-top: 15px;
}

.mini-menu .navbar-nav>li {
    border-bottom: solid 1px #decede;
    white-space: nowrap;
}

.mini-menu .navbar-nav>li:last-child {
    border-bottom: solid 0px #decede;
}

.alerts > li > a {
    padding-top:7px !important;
    font-size:1.2em;
}

i.red-alert {
    color: #ef3e36;
    padding-right:10px;
}

i.orange-alert {
    color:#f7941e;
    padding-right:10px;
}

i.black-alert {
    color:black;
    padding-right:10px;
}

i.blue-alert {
    color:#262262;
    padding-right:10px;
}

i.green-alert {
    color:#39b54a;
    padding-right:10px;
}

i.group-alert {
    color:white;
    padding-right:10px;
}

.light-grey {
    color: #efefef;
}

.hard-grey {
    color: #888888;
}

.blue {
    color:#25AAE1;
}

.blue-underscore {
    border-bottom:solid 1px #25AAE1;
}

.btn-hlink, .btn-hlink:focus {
    background-color:#25AAE1;
    color:white;
    border-radius:3px;
    margin-top:10px;
}

.btn-hlink:hover {
    background-color:#0077AE;
    color:white;
}

h1 {
    font-size:1.4em;
}

@media only screen
{
    .alert-sm {
        display: block;
    }
}
@media only screen and (max-width: 776px) and (min-width: 768px)
{
    .alert-sm {
        display: none;
    }
}

.no-emphasis {
    color:black!important;
}

.dt {
    display:table-cell
}

.va-middle {
    vertical-align:middle;
}

.a-no-decoration, .a-no-decoration:hover, .a-no-decoration:visited, .a-no-decoration:link, .a-no-decoration:active
{
    text-decoration: none;
    color:inherit;
}

.no-decoration {
    color: #000000;
}

.modal-return-close {
    color:#00aeef;
    word-spacing: 10px;
    font-size:18px;
    cursor: pointer;
    padding-left: 10px;
    white-space: nowrap;
    padding-right: 10px;
}

.engage-blue-text {
    color:#25AAE1;
}

.engage-red-text {
    color:red;
}


.btn-engage , .btn-engage:active, .btn-engage:focus {
    background-color: #0077AE !important;
    color: white;
}

.engage-blue-btn, .engage-blue-btn:hover, .engage-blue-btn:visited, .engage-blue-btn:link, .engage-blue-btn:active, .engage-blue-btn:focus {
    background-color: #00aeef;
    color: #ffffff;
    font-size: 18px;
}

.engage-large-btn {
    width: 60%;
}

.engage-small-btn {
    font-size:14px !important;
    height: 27px;
    padding-top: 2px;
    width: 75px;
}

.engage-blue-modal-btn, .engage-blue-modal-btn:hover, .engage-blue-modal-btn:visited, .engage-blue-modal-btn:link, .engage-blue-modal-btn:active .engage-blue-modal-btn:focus {
    background-color: #00aeef;
    color: #ffffff;
    font-size: 14px;
}

.engage-red-modal-btn, .engage-red-modal-btn:hover, .engage-red-modal-btn:visited, .engage-red-modal-btn:link, .engage-red-modal-btn:active .engage-red-modal-btn:focus {
    background-color: #ef3e36;
    color: #ffffff;
    font-size: 14px;
}
.engage-green-modal-btn, .engage-green-modal-btn:hover, .engage-green-modal-btn:visited, .engage-green-modal-btn:link, .engage-green-modal-btn:active .engage-green-modal-btn:focus {
    background-color: #39b54a;
    color: #ffffff;
    font-size: 14px;
}

/* la suite "sert" pour les notifications d'alertes */
.alert-flag {
    width:60px;
    height:60px;
    border-radius:50px;
    font-size:20px;
    color:#fff;
    line-height:100px;
    text-align:center;
    background:white;
    background-position:50% 50%;
    background-repeat:no-repeat;
}

.alertify-red {
    background-color: #ef3e36 !important;
    opacity: 0.96 !important;
}

.alertify-orange {
    background-color: #f7941e !important;
    opacity: 0.96 !important;
}

.alertify-green {
    background-color: #39b54a !important;
    opacity: 0.96 !important;
}

.alertify-blue {
    background-color: #262262 !important;
    opacity: 0.96 !important;
}

.s-alert-box {
  z-index: 9999 !important;
}


.hide-js {
    display: none;
}

#status-grid {
    position: relative;
    font-size: 16px;
    width: 100%;
    min-width: 950px;
    text-align: center;
    z-index: 150;
    height: 1px;
    max-height: 1px;
    overflow: visible;
}

.socket-status {
    padding-top: 5px;
    padding-bottom: 5px;
}

.ngfade.ng-leave {
    -webkit-transition: 1s linear all;
    -moz-transition: 1s linear all;
    -ms-transition: 1s linear all;
    -o-transition: 1s linear all;
    transition: 1s linear all;
    opacity:1;
}

.ngfade.ng-leave.ng-leave-active {
    opacity:0;
}

.message-status {
    padding-top: 5px;
    padding-bottom: 5px;
}

.socket-status.ok,
.message-status.ok {
    color: #25aae1;
}

.socket-status.success,
.message-status.success {
    color: #fff;
    background-color: #39b54a;
}

.socket-status.success a,
.message-status.success a {
    color: #fff;
    font-weight: bold;
}
.socket-status.success.message-discrete,
.message-status.success.message-discrete {
    color: #39b54a;
    background-color: #fff;
}

.socket-status.success.message-discrete a,
.message-status.success.message-discrete a {
    color: #39b54a;
    font-weight: bold;
}

.socket-status.ko,
.message-status.ko {
    color: #f7941e;
}

.socket-status.failed,
.message-status.failed {
    color: #fff;
    background-color:#ef3e36;
}

.no-animate {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

.discrete, .discrete:link, .discrete:visited, .discrete:hover, .discrete:active {
    color: #333;
}

.discrete:focus {
    text-decoration: none;
    outline:none;
}

.discrete:focus:hover {
    text-decoration: underline;
}

.modal-open {
    overflow: auto;
    padding-right: 0px !important;
}

.coloured-title {
    color: #25AAE1;
    border-bottom: solid 1px #25AAE1;
}

.large-modal .modal-dialog{
    width: 80%;
    min-width: 950px;
}

.middle-modal .modal-dialog{
    width: 50%;
    min-width: 475px;
}

.middle-modal-center .modal-dialog{
    width: 35%;
    min-width: 475px;
    position: fixed;
    left: 30%;
    top: 25%;

}

.modal-dialog .title {
    padding: 10px;
    font-size: 20px;
}

.modal-data-container {
    width:100%;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 50px;
    padding-right: 50px;
}

.modal-data-container.small-modal-data-container {
    padding-left: 20px;
    padding-right: 20px;
}
.large-modal .close-modal {
    position: absolute;
    right: 10px;
    top: 5px;
    font-size: 20px;
    color: #25AAE1;
    cursor: pointer;
    padding-left: 15px;
    padding-right: 15px;
}

.close-modal {
    position: absolute;
    right: 10px;
    top: 5px;
    font-size: 20px;
    color: #25AAE1;
    cursor: pointer;
    padding-left: 15px;
    padding-right: 15px;
}

.close-modal > i {
    font-size: 15px;
    padding-right: 0px !important;
}

.dt-center {
    text-align: center;
}

/* theming md-steppers : doesn't implement material Palette*/

.md-step.md-active md-step-label-wrapper::before, .md-step.md-success md-step-label-wrapper::before {
    background-color: #25aae1 !important;
}

.md-step.md-complete md-step-label-wrapper::before {
    background-color: #25aae1 !important;
}

.md-step.md-complete.md-active md-step-label-wrapper::before {
    background-color: #25aae1 !important;
}

.pagination > li > a, .pagination > li > span {
    padding-left: 1px;
    padding-right: 1px;
    padding-top: 5px;
    padding-bottom: 7px;
}

.engage-nota-bene {
    text-align: left;
    font-style: italic;
}

h3.engage-custom {
    text-align:left;
    font-size: 20px;
    color: #25aae1;
    padding-bottom: 4px;
    border-bottom: 2px solid #25aae1;
    margin-top: 0px;
}

h4.engage-custom {
    color: #25aae1;
    text-align: left;
    border-bottom: 1px dashed #25aae1;
    margin-top: 25px;
}

h4.engage-custom.engage-custom-low-top-spacing {
    margin-top: 10px;
}

h5.engage-custom {
    color: black;
    text-align: left;
    border-bottom: 1px solid black;
    margin-top: 25px;
    font-weight: bold;
}

h6.engage-custom {
    color: black;
    text-align: left;
    border-bottom: 1px solid black;
    font-size: 14px;
    margin-top: 20px;
}

md-list.engage-md-primary md-list-item button.md-button:not([disabled]):hover {
    background-color: rgba(25, 170, 225, 0.2);
}

md-select[disabled]:hover {
    cursor: not-allowed!important;
}

[disabled]:hover {
    cursor: not-allowed!important;
}

.engage-md-dialog {
    min-width: 800px;
}

.engage-md-dialog-title {
    padding: 10px 15px;
    font-size: 18px;
}

.engage-md-dialog-subtitle {
    font-size: 14px;
    color: #666666;
}

.md-select-menu-container {
    z-index: 10050!important;
}


/*in the above modification of md-select, we put the select list over a possible popup, the backdrop is here to intercept click button to close the select list, it should also be over the possible popup*/

md-backdrop.md-select-backdrop {
    z-index: 5000;
}

.md-datepicker-calendar-pane {
    z-index: 10050!important;
}

.md-panel-outer-wrapper {
    z-index: 10050!important;
}

.datatable-loading-message {
    text-align: center;
}

.font-awesome-delete {
    color: #ef3e36;
}

img.desaturate{
    filter: grayscale(100%); /* Current draft standard */
    -webkit-filter: grayscale(100%); /* New WebKit */
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%); /* Not yet supported in Gecko, Opera or IE */
    filter: url("data:image/svg+xml;utf8,<svg%20xmlns='http://www.w3.org/2000/svg'><filter%20id='grayscale'><feColorMatrix%20type='matrix'%20values='0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

.tiny-error-message {
	color:rgb(221,44,0);
	font-style: italic;
	font-size: 0.8em;
}

.input-error-message {
	font-size: 0.7em;
	color:rgb(221,44,0);
}

.input-error-message-code-exist {
    padding-left: 5px;
    margin-top: -18px;
    display: block;
    width: 70%;
}

.input-info-message {
    font-size: 0.7em;
    font-style: italic;
}

.popover {
	font-family: "Source Sans Pro";
}

.warning {
    color: #f7941e;
}

.engage-fa-slash {
    font-size: 50px;
    -ms-transform: rotateZ(35deg) translateY(-9px) translateX(-6px);
    -moz-transform: rotateZ(35deg) translateY(-9px) translateX(-6px);
    -o-transform: rotateZ(35deg) translateY(-9px) translateX(-6px);
    -webkit-transform: rotateZ(35deg) translateY(-9px) translateX(-6px);
    transform: rotateZ(35deg) translateY(-9px) translateX(-6px);
}

.va-super {
	vertical-align: super;
}

.va-top {
	vertical-align: top;
}

.va-bottom {
	vertical-align: bottom;
}

.va-middle {
	vertical-align: middle;
}

md-input-container.autocomplete.md-icon-left md-icon.patient-inclusion-small-input-icon {
	padding-top: 15px;
}


.md-autocomplete-suggestions-container li span.highlight {
	color: black;
	font-weight: bold;
}

md-input-containter.autocomplete {
	cursor: pointer;
}

md-input-container.autocomplete .md-select-icon,
div.autocomplete .md-select-icon  {
    position: absolute;
    top: 45%;
    left: 97%;
	cursor: pointer;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid;
	border-top-color: rgba(0,0,0,0.54);
}


#delete-action {
    color: #ef3e36;
}

.no-uppercase {
    text-transform: none;
    font-size: inherit;
}

.engage-autocomplete-add md-autocomplete-wrap:before {
    font-family: FontAwesome;
    content: "\F067";
    line-height: 1;
    font-size: 16px;
    font-weight: normal;
    color:#25AAE1;
    padding: 12px 0px 0px 12px;
}


.engage-autocomplete-add input::placeholder {
    color:#25AAE1;
    font-size: 12px;
}

.engage-inline-block {
    display: inline-block;
}
.version-code {
    font-size: 3em;
    color: #25AAE1;
    text-align: center;
}

.light-grey {
    color: #dddddd;
}

md-dialog div.upload-image-modal {
    min-width: 500px;
    min-height: 200px;
    padding: 3px 20px;
}

md-dialog div.upload-image-modal h3{
    text-align: center;
    color: #25AAE1;
    margin-bottom: 15px;
}


md-dialog div.upload-image-modal div.file{
    max-width: 300px;
    display: inline-block;
}


md-dialog div.upload-image-modal div.image-preview{
    max-width: 150px;
    display: inline-block;
    padding: 5px;
}

md-dialog div.upload-image-modal div.image-preview img{
    max-width: 140px;
    max-height: 140px;
}

md-dialog div.upload-image-modal .buttons-container{
    margin-top: 25px;
}

.mat-checkbox-layout { white-space: normal !important; }

.exolis-logo-small {
    position: absolute;
    bottom: 10px;
    right: -60px;
}

.exolis-logo-small img {
    width: 100px;
}

.view-wrapper {
    position: relative;
    min-height: calc(100vh - 90px);
}

.engage-tooltip {
    display: inline-block;
    position: absolute;
    z-index: 100;
    background-color: grey;
    color: white;
    font-size: 12px;
    padding: 5px;
    border-radius: 5px;
    opacity: 1;
}

.orga-popover{
    width: max-content;

}

.selection-patient-structure-span{
    display: flex;
}

.selection-patient-structure-span-name{
    width: max-content;
}

span.md-primary {
    color: #25aae1;
}

.modal-open .modal {
    overflow-y: overlay;
}
.expert-mode-link {
    color: #E6007E;
}

.expert-mode-link.expert-mode-link-active {
    background-color: #E6007E;
    color: white;
}
