
#loading{
    position:fixed;
    background-color:#333333;
    opacity: 0.25;
    z-index: 99999;
    width:100%;
    height:100%;
    display:none;
    top:0;
}
.sk-circle {
    margin: auto;
    width: 80px;
    height: 80px;
    position: relative;
    top:50%;
}
.sk-circle .sk-child {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.sk-circle .sk-child:before {
    content: '';
    display: block;
    margin: 0 auto;
    width: 15%;
    height: 15%;
    background-color: #FFF;
    border-radius: 100%;
    -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
    animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
}
.sk-circle .sk-circle2 {
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg); }
.sk-circle .sk-circle3 {
    -webkit-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg); }
.sk-circle .sk-circle4 {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }
.sk-circle .sk-circle5 {
    -webkit-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg); }
.sk-circle .sk-circle6 {
    -webkit-transform: rotate(150deg);
    -ms-transform: rotate(150deg);
    transform: rotate(150deg); }
.sk-circle .sk-circle7 {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg); }
.sk-circle .sk-circle8 {
    -webkit-transform: rotate(210deg);
    -ms-transform: rotate(210deg);
    transform: rotate(210deg); }
.sk-circle .sk-circle9 {
    -webkit-transform: rotate(240deg);
    -ms-transform: rotate(240deg);
    transform: rotate(240deg); }
.sk-circle .sk-circle10 {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg); }
.sk-circle .sk-circle11 {
    -webkit-transform: rotate(300deg);
    -ms-transform: rotate(300deg);
    transform: rotate(300deg); }
.sk-circle .sk-circle12 {
    -webkit-transform: rotate(330deg);
    -ms-transform: rotate(330deg);
    transform: rotate(330deg); }
.sk-circle .sk-circle2:before {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s; }
.sk-circle .sk-circle3:before {
    -webkit-animation-delay: -1s;
    animation-delay: -1s; }
.sk-circle .sk-circle4:before {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s; }
.sk-circle .sk-circle5:before {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s; }
.sk-circle .sk-circle6:before {
    -webkit-animation-delay: -0.7s;
    animation-delay: -0.7s; }
.sk-circle .sk-circle7:before {
    -webkit-animation-delay: -0.6s;
    animation-delay: -0.6s; }
.sk-circle .sk-circle8:before {
    -webkit-animation-delay: -0.5s;
    animation-delay: -0.5s; }
.sk-circle .sk-circle9:before {
    -webkit-animation-delay: -0.4s;
    animation-delay: -0.4s; }
.sk-circle .sk-circle10:before {
    -webkit-animation-delay: -0.3s;
    animation-delay: -0.3s; }
.sk-circle .sk-circle11:before {
    -webkit-animation-delay: -0.2s;
    animation-delay: -0.2s; }
.sk-circle .sk-circle12:before {
    -webkit-animation-delay: -0.1s;
    animation-delay: -0.1s; }
@-webkit-keyframes sk-circleBounceDelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 40% {
          -webkit-transform: scale(1);
          transform: scale(1);
      }
}
@keyframes sk-circleBounceDelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 40% {
          -webkit-transform: scale(1);
          transform: scale(1);
      }
}

.dataTables_filter input{
    width:80px;
}
.dataTables_wrapper .dataTables_length{
    min-width:130px;
}
#footer{
    position:fixed;
    bottom:0px;
    background-color:transparent;
}
.nomargin{
    margin: 0 !important;
}
.nopaddingtop{
    padding-top:0 !important;
}
.table.table-hover tr:hover td{
    background:#a4ccf1;
}
.redbg{
    background-color:#e51400 !important;
    color:#FFF;
}
.btn:disabled,
.btn-block:disabled{
    background-color:#333333 !important;
}
.form-control[readonly]{
    cursor:default !important;
}
tr:hover td{
    background-color:#EEE;
}
tr.selected td{
    background-color:#a4ccf1;
}
#main{
    /*  padding-bottom:100px !important; */
}
#left{
    /* padding-bottom:100px !important;*/
}
.modal-backdrop {
    /*z-index: -1 !important;*/
}
label:first-letter {
    text-transform:capitalize;
}
#navigation #brand{
    /*padding-left:0px;*/
    /*background:none;*/
    /*background-size:none;*/
    background-size: 22px;
    width: 145px;
}
.login .wrapper .login-body .forget{
    margin-top:25px !important;
}
.login .wrapper {
    top: 30% !important;
}

.balance-overview{
    text-align:center;
}

@media (max-width: 480px){
    body.login .wrapper {
        top:0 !important;
    }
}

#tablePaymentDetails th.qty{
    width:80px;
}
#tablePaymentDetails input.qty{
    width:50px;
}
#tableProductDetails input.qty{
    width:50px;
}

.alignright{
    text-align:right;
}

#left.full{
    padding-bottom:50px !important;
}

#uploadScreenshot,
.uploadBox{
    width:100%;
    min-height:100px !important;
    cursor:pointer;
    text-align:center;
}

#uploadScreenshot h5{
    padding-top:40px;
}

#chart-container {
    position: relative;
    display: inline-block;
    top: 10px;
    left: 10px;
    height: 1200px;
    width: calc(100% - 24px);
    border: 2px dashed #aaa;
    border-radius: 5px;
    overflow: auto;
    text-align: center;
}

#chart-container .orgchart{
    background-image: linear-gradient(90deg, rgba(160, 0, 80, .1) 5%, rgba(0, 0, 0, 0) 10%), linear-gradient(rgba(160, 0, 80, .1) 5%, rgba(0, 0, 0, 0) 10%)
}

#chart-container tr:hover,
#chart-container tr:hover td{
    background-color:unset;
}

.orgchart .node{
    width:80px !important;
    /*height:80px !important;*/
    border:1px solid #eeb111;

}
.orgchart .lines .downLine{
    /*height:10px !important;*/
}
.orgchart .lines:nth-child(3) td{
    /*height:7px !important;*/
}

.login .wrapper .login-body{
    padding-bottom:20px;
}

#navigation .user img{
    width:27px;
    height:27px;
    object-fit: cover;
}

#left .userg,
#left .rank{
    padding-top: 5px;
    padding-bottom: 5px;
    color: white;
    font-weight: bold;
    text-align: center;
}
#left .userg.owner{
    background-color: #000;
    color:#FFF;
}
#left .userg.admin{
    background-color: red;
}
#left .userg.member{
    background-color: #a05000;
}
#left .userg.sales{
    background-color: #dd8907;
}
#left .userg.accounting,
#left .userg.accounting_manager{
    background-color: #339933;
}
#left .userg.admin{
    background-color: red;
}

#left .rank.premium,
td.premium,
h4.premium,
#left .rank.starter,
td.starter,
h4.starter{
    background-color:#eeb111;
    color:white;
}
#left .rank.platinum,
td.platinum,
h4.platinum{
    background-color:#eeb111;
    color:white;
}
#left .rank.elite,
td.elite,
h4.elite,
#left .rank.vip_package,
td.vip_package,
h4.vip_package,
#left .rank.center,
td.center,
h4.center{
    background-color:#8F3985;
    color:white;
}
#left .rank.lite,
td.lite,
h4.lite,
#left .rank.starter_package,
td.starter_package,
h4.starter_package{
    background-color:#66cc33;
    color:white;
}
#left .rank.supreme,
td.supreme,
h4.supreme{
    background-color:#BF211E;
    color:white;
}

#left .rank.ranked,
td.ranked,
h4.ranked{
    background-color:#368ee0;
    color:white;
}
/*#left .rank.rank,*/
/*td.rank,*/
/*h4.rank{*/
/*background-color:#368ee0;*/
/*}*/

#left .rank.classic,
td.classic,
h4.classic{
    background-color:#666666;
    color:white;
}
.subnav-title.rank.norank,
h4.norank{
    background-color:darkgrey;
    color:white;
}

#bottom-status{
    bottom:0;
    width:100%;
    padding:5px 0px 5px 0px;
    font-size:14pt;
    font-weight:bold;
    z-index:9999;
    position:fixed;
    color:#FFF;
    background-color:#a2d246;
    display:none;
    text-align:center;
}
#bottom-status.show{
    display:block;
}
#bottom-status.hide{
    display:none;
}
#bottom-status.success {
    display:block;
    color: #3c763d;
    background-color: #dff0d8;
    border-top:1px solid #d6e9c6;
}
#bottom-status.danger {
    display:block;
    color: #a94442;
    background-color: #f2dede;
    border-top:1px solid #ebccd1;
}

.table.dataTable.dataTable-scroll-x tr.dataTable-col_filter th{
    white-space:pre;
}

.lb-rotate,.lb-close{
    color:#FFF !important;
}

.lb-rotate h2,.lb-rotate h3,.lb-close h3,.lb-close h3
{
    margin:0;
    padding:0;
}
.proof-of-payment h4{
    border-bottom:1px solid #EEE;
}
.avi-gallery{
    text-align:center;
}
.avi-gallery a{
    display:inline-block;
    margin:2px;
}
.avi-gallery img.cover{
    width:150px;
    height:150px;
    object-fit:cover;
    border:1px solid #EEE;
}

.treenode img{
    width:70px;
    height:70px;
    object-fit:cover;
}

#chart-container > div > table > tbody > tr.nodes > td > table > tbody > tr.nodes > td:nth-child(1){
    background-color:hsla(200, 100%, 70%, 0.3) !important;
}

#chart-container > div > table > tbody > tr.nodes > td > table > tbody > tr.nodes > td:nth-child(2){
    background-color:hsla(120, 100%, 80%, 0.3) !important;
}
.treenode .title,
.treenode .content{
    background-color:#cccccc !important;
}
.treenode .content{
    border: 1px solid #cccccc !important;
    border-radius: 0 0 4px 4px !important;
}
.treenode .image-box{
    width:70px;
    height:70px;
    background: url("../img/blank.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
}
.treenode.male .image-box{
    background: url("../img/male.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
}
.treenode.female .image-box{
    background: url("../img/female.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
}
.treenode.company{
    margin-left:-35px;
}
.treenode.company .image-box{
    background: url("../img/logo.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    width:140px;
    height:140px;
}

.treenode.company .title{
    display:none;
}
.treenode.company .content{
    display:none;
}

.treenode.classic .title{ background-color:#b3b3b3 !important; }
.treenode.classic .content{ background-color:#FFF !important; }
.treenode.ranked .title{ background-color:#66b3ff !important; }
.treenode.ranked .content{ background-color:#FFF !important; }
.treenode.premium .title{ background-color:#ff8c66 !important; }
.treenode.premium .content{ background-color:#FFF !important; }
.treenode .title.account-no a{
    color:#FFF !important;
}

#generalInfoForm .dz-details
,#generalInfoForm .dz-size
,#generalInfoForm .dz-preview
,#generalInfoForm .dz-filename
,#generalInfoForm .dz-progress
,#generalInfoForm .dz-success-mark
,#generalInfoForm .dz-error-mark
,#newUserRegistrationForm .dz-preview
{
    display:none !important;
}

#generalInfoForm .profile-pic
,#newUserRegistrationForm .profile-pic
{
    width:180px;
    height:180px;
    object-fit:cover;
    background-position:center;
}

.navprofilepic img{
    width:100px;
    height:100px;
    object-fit: cover !important;
    object-position: center !important;
}

@media (max-width: 1024px) {
    #main .page-header .stats {
        display: block;
    }
}

@media (max-width: 840px){
    #main .page-header .stats {
        display: none;
    }
}

.box-content.updates img{
    width:100% !important;
    height:auto !important;
}

#navigation #brand{
    background: url("../philtycoon_logo_3.png") no-repeat !important;
    background-size:22px 22px !important;
    font-size:18px !important;
}

.padding{
    padding:10px !important;
}

.margin{
    margin:10px !important;
}

.bootbox-close-button{
    position:absolute;
    right:20px;
}

.logo #logo_sidebar{
    width: 65%;
    /*position:absolute;*/
    /*top:10px;*/
    /*left:10px;*/
}

.logo{
    text-align: center;
}

.navbar--nav .nav--user img{
    height:50px;
    object-fit: cover;
}