[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important;
}

[ng-click],
.ng-binding {
    outline: none;
}

* {
    position: relative;
}

html {
    background: rgb(250, 250, 250);
}

body {
    --color-text: #333;
    --color-bg: #fff;
    --color-link: #333;
    --color-link-hover: #A50046;
    --color-header: #A50046;
    --color-dark-bg: #231F20;
    --color-medium-bg: rgba(35, 31, 32, 0.75);
    --color-light-bg: rgba(35, 31, 32, 0.50);

    font-family: 'IBM Plex Sans', monospace;
    min-height: 100vh;
    color: #333;
    color: var(--color-text);
    background-color: rgb(250, 250, 250);
    background-color: var(--color-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'IBM Plex Sans', sans-serif;
    font-weight: 700;
}

a {
    text-decoration: none;
    color: var(--color-link);
    outline: none;
}

a:hover,
a:focus {
    color: var(--color-link-hover);
}

button:focus,
a:focus {
    outline: none;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

.pagination li {
    display: inline;
    outline: none;
}

.pagination li :first-child a {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.pagination .disabled a {
    color: #CECECE;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #e1e1e1;
}

.pagination .active a {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #A50046;
    border-color: #A50046;
}

.pagination li a {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #A50046;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #e1e1e1;
}


.fit {
    height: 100%;
    width: 100%;
}

.sidenav {
    font-family: 'IBM Plex Mono', sans-serif;
}

.sidenav .nav-logo {
    text-align: center;
}

.sidenav .md-content {
    background-color: transparent;
}

.sidenav .main-menu li a {
    width: 100%;
    text-align: left
}

.sidenav .main-menu li a:hover {
    background-color: transparent;
    color: #fff;
}

.absolute-top-right {
    position: absolute;
    right: 0;
    top: 0;
}

md-toast.md-success-toast-theme .md-toast-content {
    background-color: rgba(21, 132, 13, 0.95);
}

md-toast.md-error-toast-theme .md-toast-content {
    background-color: rgba(132, 13, 13, 0.95);
}

.md-errors-spacer{
    display: none;
}

.controls .md-button{
    min-width: 50px !important;
}

.accent-button{
    max-width: 200px;
    min-width: 200px;
    border-radius: 5px;
    border: 1px solid lightgrey;
    text-transform: none;
}

.userInfo, .analysisInfo{
    border: 1px solid lightgrey; 
    border-radius: 5px; 
    padding: 20px;
    padding-top: 0px; 
    margin-top: 20px;
    padding-bottom: 20px;
    position: initial;
    z-index: 40;
    top: 10px;
    background: rgba(250,250,250,1);
    -webkit-box-shadow: 0px -9px 27px 21px rgba(255,255,255,1);
    -moz-box-shadow: 0px -9px 27px 21px rgba(255,255,255,1);
    box-shadow: 0px -9px 27px 21px rgba(255,255,255,1);
}

.userInfos, .analysisInfos{
    border: 1px solid lightgrey; 
    border-radius: 5px; 
    padding: 20px;
    padding-top: 0px; 
    margin-top: 20px;
}

.view-container{
    margin: 0 auto;
    width: 95%;
}

.generalTableLine{
    border: 1px solid lightgrey;
    border-radius: 5px;
    margin-top: 10px;
}

.analysisTableLine .md-button{
    padding-left: 5px !important;
}

.status{
    padding: 5px; border-radius: 3px; width: 100px; text-align: center; text-transform:capitalize;
}

.statusPending{
    background-color: rgba(253, 184, 19, 0.7);
    color: rgba(0,0,0,0.54);
}

.statusDone{
    background-color: rgba(21, 132, 13, 0.7);
    color: rgba(255,255,255,0.9);
}

.statusDone p{
    color: rgba(255,255,255,0.9) !important;
}

.filter-wrapper{
    border: 1px solid lightgrey; 
    border-radius:5px; 
    padding-right:50px; 
    padding-left: 50px; 
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 20px;
}

div.filter-wrapper .layout-column.flex {
    overflow: hidden;
}

.alternate-label{
    width: calc(100% - 34px) !important;
}
md-tabs [role="tabpanel"] {
    transition: none;
}
md-tabs md-ink-bar {
    transition: none;
}

#flip3D{
    margin: 10px;
    float: left;
    width: 125px;
}

#flip3D > .statusPending {
    position: absolute;
    transform: perspective( 600px ) rotateX( 0deg );
    backface-visibility: hidden;
    transition: transform .5s linear 0s;
}

#flip3D > .statusDone {
    position: absolute;
    transform: perspective( 600px ) rotateX( 180deg );
    backface-visibility: hidden;
    transition: transform .5s linear 0s;
}

md-autocomplete[md-floating-label] md-input-container {
    padding-bottom: 2px;
}
/* Accordion Example */
.md-accordion .expandCollapse { 
    width:30px; 
    height:30px; 
    position:relative; 
    font-size:20px; 
    font-weight:bold; 
    cursor:pointer; 
    color:lightgrey; 
    display:block; 
    margin-top: -2px; 
    margin-left: -2px; 
    overflow:hidden; 
} 

.md-accordion .expandCollapse:active {
    border:0px;
}

.md-accordion .expandCollapse:before, .md-accordion .expandCollapse:after { 
    width:30px; 
    height:30px; 
    display:block; 
    position:absolute; 
    top:0; 
    left:0; 
    line-height:32px; 
    text-align:center; 
    -webkit-transition: .3s all ease-out; 
    transition: .3s all ease-out; 
}

.md-accordion .expandCollapse:before { 
    opacity:1;
     -webkit-transform: rotate(0deg); 
     transform: rotate(0deg); 
     content: "|"; 
     margin-top:-3px; 
}

.md-accordion .expandCollapse:after { 
    opacity:1; 
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg); 
    content: "|"; 
    margin-left:-3px; 
}

.md-accordion .active:before { 
    opacity:1; 
    -webkit-transform: rotate(90deg); 
    transform: rotate(90deg); 
    margin-left:3px; 
    margin-top:0px; 
}

.md-accordion .dataContent { 
    background: #F2F2F2; 
    max-height:0px; 
    overflow:hidden; 
    -webkit-transition: .3s all ease-out; 
    transition: .3s all ease-out; 
    transition-property: all;

    border: 1px solid lightgrey;
    border-top: none;
    border-bottom: none;

}
.md-accordion .activeContent { 
    max-height: fit-content;
    height: fit-content;
    padding:0; 
    display:block; 
    border-bottom: 1px solid lightgrey;
}

.md-accordion md-toolbar{ 
    cursor:pointer; 
}

.md-toolbar-tools:not(.generalToolbar) {
    background-color: rgb(250,250,250);
    color: #333;
}

.md-toolbar-tools > * {
    font-size: 16px !important;
}

.addTab{
    margin-left: 15px;
    width: 36px !important;
    height: 36px !important;
}

.addTab md-icon{
    font-size: 22px;
}

.md-fab[disabled='true']{
    background-color: lightgrey !important;
}

.analysis-number {
    text-align: center;
    line-height: 80px;
    font-size: 36px;
}

@media screen and (max-width: 650px){
    .analysis-number {
        font-size: 24px;
    }
}

.loading-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ffffff;
    margin: 8px;
}

.list-loading-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgb(250, 250, 250);;
}

md-card{
    min-height: 164px;
    max-height: 164px;
}

.md-toast-content span{
    text-align: center;
}

.parent-list-item menu-link .md-button:hover{
    color: inherit !important;
}

.edInput{
    color: rgba(0,0,0,0.87) !important;
}

.title-no-margin {
    margin-bottom: 10px;
    margin-top: 10px;
}

.sugar-alert {
    border: 5px solid red !important;
    border-radius: 5px !important;
}

md-card md-card-title md-card-title-media .md-media-sm {
    height: 80px;
    width: auto;
    margin-right: 10px;
}