@font-face {
       font-family: 'SofiaProLight';
             src: url('fonts/SofiaProLight.eot');
             src: url('fonts/SofiaProLight.eot?#iefix') format('embedded-opentype'),
       url('fonts/SofiaProLight.svg#SofiaProLight') format('svg'),
       url('fonts/SofiaProLight.ttf') format('truetype'),
       url('fonts/SofiaProLight.woff') format('woff'),
       url('fonts/SofiaProLight.woff2') format('woff2');
             font-weight: normal;
             font-style: normal;
         }
         @font-face {
  font-family: 'SofiaProRegular';
  src: url('fonts/SofiaProRegular.eot');
  src: url('fonts/SofiaProRegular.eot?#iefix') format('embedded-opentype'),
       url('fonts/SofiaProRegular.svg#SofiaProRegular') format('svg'),
       url('fonts/SofiaProRegular.ttf') format('truetype'),
       url('fonts/SofiaProRegular.woff') format('woff'),
       url('fonts/SofiaProRegular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}
 body {
    font-family: 'SofiaProRegular', sans-serif;
    font-size: 13px;
    color: #030021;
    background-color: #f3f5f9;
    font-weight: 400;
    margin: 0;
}
.navigation-bar {
            background-color: #ffffff !important;
            border-color: #ffffff !important;
            height: 72px;
            position: fixed;
            width: 100%;
            top: 0;
            box-shadow: 0 3px 5px 0 rgba(4, 10, 41, .125);
            z-index: 11;
        }

.padding-vertical {
    padding-top: 20px;
    padding-bottom: 20px;
}
.application-title {
    text-align: center;
    font-size: 20px;
    margin: 0;
}

.navbar-inverse {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    padding: 11px 10px;
   /* background-color: #b8b4b4 !important;
    border-color: #b8b4b4 !important;*/
}
.navbar-inverse .navbar-nav>li>a {
    color: #333 !important;
}
.pro-logo{
    max-width: 200px;
    margin-top: 3px;
}
.btusubmit{
   background-color: #284463 !important;
    border-color: #284463 !important; 
    color: #fff !important;
}
.btusubmit:hover{
   background-color: #284463 !important;
    
}
.gridviews th{
    font-weight: 600 !important;
}.gridviews thead{
    background-color: #ccc !important;
}
.summarydetails ul li span:first-child {
    padding: 5px 10px;
    background: #ececef;
    /*font-weight: 600;*/
    font-size: 13px;
    color: #333;
    border-bottom: 2px solid #fff;
    margin: 0;
}
.summarydetails ul li span{    
    display: table-cell;
    width: 50%;
    vertical-align: middle;
}
.summarydetails ul li {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.summarydetails ul {
    padding: 0 10px;
}
.summarydetails ul li span:last-child {
    padding-left: 10px;
    color: #333;
}
.summarydetails ul li span {
    display: table-cell;
    width: 50%;
    font-size: 14px;
    vertical-align: middle;
}
.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 11111;
    background: rgba(0,0,0,0.5);
    width: 100%;
    display:table;
    height: 100%;
}
.loadingAnimation{
    font-size: 44px;
    color: #fff;
    max-width: 45px;
    max-height: 45px;
    display:table-cell;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
.datatable-header, .datatable-footer {
    padding: 0px 20px 0 20px;
}
.panel-body{
padding: 10px 20px 10px 20px;
}
.panel-heading{
    padding: 10px 20px !important;
    }

.volume-rate-table{text-align:left;width:100%;margin-top:.5rem}
.volume-rate-table thead tr{padding-bottom:0}
.volume-rate-table thead tr th{font-size:16px;padding-bottom:.5rem}
.volume-rate-table tr{display:block;padding:0 .5em .325em}
.volume-rate-table tr.active{background:#b8b4b4}
.volume-rate-table tr.active td{color:#2b4562}
.volume-rate-table tr.active td strong{color:#2b4562;font-weight:600}
.volume-rate-table tr.active td:nth-child(2){font-weight:600}
.volume-rate-table tr td,.volume-rate-table tr th{line-height:1.6em;margin-top:0;color:#2b4562;display:block;font-size:14px;text-align:left;display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box}
.volume-rate-table tr td.italic,.volume-rate-table tr th.italic{font-style:oblique}
.volume-rate-table tr td.small,.volume-rate-table tr th.small{font-size:.825rem}
.volume-rate-table tr td strong,.volume-rate-table tr th strong{color:#2b4562;font-weight:400}
.volume-rate-table tr td a,.volume-rate-table tr th a{color:#2b4562;display:inline}
.volume-rate-table tr td a:hover,.volume-rate-table tr th a:hover{text-decoration:underline}
.volume-rate-table tr td.white,.volume-rate-table tr td.white strong,.volume-rate-table tr th.white,.volume-rate-table tr th.white strong{color:#fff}
.volume-rate-table tr td+.h2,.volume-rate-table tr td+.h3,.volume-rate-table tr th+.h2,.volume-rate-table tr th+.h3{margin-top:1.5rem}
.volume-rate-table tr td.inline,.volume-rate-table tr th.inline{text-align:left;padding-left:1.5em}
.volume-rate-table tr td:first-child,.volume-rate-table tr th:first-child{width:46%}
.volume-rate-table tr th{color:#2b4562;font-weight:300}
.volume-rate-table+.h5{border-top:1px solid #f3f5f9;margin-top:1.5rem;display:block;padding-top:1.5rem}


      .page-container {
            padding-top: 90px;
            padding-left: 11px;
            padding-right: 20px;
        }
.navbar-default .navbar-nav>.active>a:after {
            background-color: transparent;
        }


        table tr td.text-right {
            padding-right: 40px;
        }

        @media (min-width: 1400px) {
            .container {
                width: 1400px;
            }
        }

        .dataTable thead .sorting:after,
        .dataTable thead .sorting:before {
            color: #ffffff;
        }

        .gridviews thead {
            background-color: #2b4562 !important;
            color: white;
        }

        .breadcrumb-header {
            margin-bottom: 20px;
        }

        .navbar-component.navbar-default {
            border-color: transparent;
            background-color: transparent;
            padding: 0;
        }

        .navbar-default .navbar-nav>li>a {
            color: #a2acbc;
            font-weight: 500;
            padding: 8px 12px;
        }

        .navbar-default .navbar-nav>li>a:focus,
        .navbar-default .navbar-nav>li>a:hover {
            color: #6d7586;
            background-color: transparent !important;
        }

        .navbar-default .navbar-nav>li.active>a {
            color: #1e9fc4 !important;
            font-weight: 500;
            background-color: transparent;
            padding: 8px 12px;
        }

        .navbar-inverse .navbar-nav>li>a:hover,
        .navbar-inverse .navbar-nav>li>a:focus {
            background-color: rgba(222, 222, 222, 0.15) !important;
        }

        .dropdown:hover .dropdown-menu {
            display: block;
            border: 1px solid #ddd;
            margin-top: 0px;
        }

        .datatable-header,
        .datatable-footer {
            padding: 10px !important;
        }

        .datatable-footer {
            border-top: 1px solid #ddd !important;
        }

        .breadcrumb>li>a {
            color: #6d7586;
            font-weight: 600;
        }

        .dataTables_info {
            padding: 7px 0;
        }

        .breadcrumb>.active {
            color: #1e9fc4;
            font-weight: 600;
        }

        .select2-results__option[aria-selected=true] {
            background-color: #0094d4;
            color: #fff;
        }

        .dataTables_filter,
        .dataTables_length,
        .dataTables_paginate,
        .dataTables_info {
            margin-bottom: 0;
        }

        a {
            color: #0094d4;
        }

        .summarydetails ul li span:first-child {
            background: #f3f5f9;
        }

        .border-btn{
            border: 1px solid #284463 !important;
            background-color: #fff !important;
            color: #284463 !important;
        }

        .alertdiv{
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #258c2c !important;
    border-radius: 3px;
        }

        .info li{
padding: 2px 2px;
color: #888;
        }


        .alert-warning {
            background-color: #fffaee;
            border-color: #ff9800;
            color: #ef6c00;
        }

        .select2-selection--single .select2-selection__rendered, .select2-selection__arrow{
            color: #a9acbc;
        }

        .border-right, .border-left{
            border-color: #ddd;
        }

        .chartdetail{
            display: flex;
            align-items: center;
        }

        .chartdetail .table>tbody>tr>td{
            padding: 1px 20px;
            color: #797979;
            font-size: 14px;
        }

        .chartdetail .table>tbody>tr>td i{
            font-size: 20px;
        }

        @media (max-width: 1244px){
            #campaign-status-pie,#campaign-pie{
                display: none;
            }
        }
        .altershowMsg {
            margin-top: 90px!important;
            margin-bottom: -70px!important;
        }