﻿* { box-sizing: border-box; -moz-box-sizing: border-box; font-family: 'Montserrat', sans-serif; font-weight: 300;}

body {font-family: 'Montserrat', sans-serif; font-weight: 300; font-size: 14px; background:#ebf0f7; margin: 0;}

a { color: #1758b4; text-decoration: underline; }
a { text-decoration: underline #ccc; }
    a:hover { color: #1758b4; text-decoration: underline #1758b4; }


/*Login Styles*/
.login-container { width: 700px; margin: 50px auto; padding: 30px; background: #fff;}

/*Header*/

header { background:#083c6f; padding: 20px 30px; -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.2); color:white; box-shadow: 0 0 30px 0 rgba(0,0,0,.2); position: relative; z-index: 2; position: relative;}
#header-title { position:relative; top:16px; left:10px; font-weight:600; }

.headerNav #logged-user {display: inline-block; margin-right: 10px;}
.headerNav a { display: inline-block; margin-right: 10px; text-decoration:none; color:white; font-weight: 500;}

.logo-container { position: absolute; top: 15px; left: 20px; max-width: 180px; }
    .logo-container img { width: 100%; height: auto;}


.header .float-right {padding-top: 15px;}   
header .float-right a {color: #fff;}

#header-title-nav { padding-top: 15px;}
#header-title-nav a { text-decoration:none; margin: 10px; }


/*Navigation*/
nav#main-nav { background:#dce2ec; position: fixed; top: 55px; left: 0; bottom: 53px; width: 300px; padding: 0; display:none;}
nav#main-nav a { display:block; padding: 15px 30px; border-bottom: 1px solid #ebf0f7; font-size: .8em; overflow: auto;}    




/*Dashboard Section*/
section#dashboard-section { padding: 15px; position: fixed; top: 57px; left: 0; right: 0; bottom: 53px; overflow: auto;}

.dashboard-progress-header { background:#fff; margin-bottom: 15px;}
    .dashboard-progress-header .width25 { padding: 20px; border-left: 1px solid #dce2ec; text-align:center;}
        .dashboard-progress-header .width25:first-child { border-left: 0;}

.dashboard-meta { color: #5e6777; font-size: .8em;}

.dashboard-progress-header-type { display:block; border-bottom: 1px solid #dce2ec; font-size: .8em; font-weight: 700; text-transform:uppercase;padding-bottom: 5px; margin-bottom: 5px;}
    .dashboard-progress-header-type span { margin-right: 5px;}
.dashboard-progress-header-number { font-size: 4em; font-weight: 700;}

.dashboard-progress-bar { background:#dce2ec; height: 10px; width: 100%; border-radius: 10px; -moz-border-radius: 10px; margin: 10px 0; position: relative; overflow: hidden;}
.dashboard-current-progress { position: absolute; width: 25%; height: 100%; background:#28975d;}

.dashboard-filter { background:#dce2ec; padding: 10px; margin-bottom: 15px;}
    .dashboard-filter .form-item-container { margin-bottom: 0;}

.dashboard-title {text-transform: uppercase; font-size: .9em; font-weight: 700; text-transform:uppercase;}

.dashboard-column-title { }
.dashboard-column-title ul {margin: 0; padding: 0; list-style:none; }
    .dashboard-column-title ul li {float:left; padding: 0 0 15px 0; width: 30%; padding-left: 10px;}
    .dashboard-column-title ul li:first-child { width: 70%; text-align: left; padding-left:0;}

.dashboard-item { background:#fff; border-bottom: 1px solid #dce2ec;}
    .dashboard-item ul {margin: 0; padding: 0; list-style:none; }
    .dashboard-item ul li {float:left; padding: 10px; width: 30%; text-wrap:none; white-space:pre; text-overflow:ellipsis; overflow:hidden; position:relative;}
        .dashboard-item ul li span { display: inline-block; padding-right: 10px;}

.dashboard-escalated-items ul li:first-child { width: 70%; text-align: left; border-left: 5px solid #cc0606}
    .dashboard-escalated-items ul li:first-child span {  color:#cc0606;}

.dashboard-pending-items ul li:first-child { width: 70%; text-align: left; border-left: 5px solid #ddab08}
    .dashboard-pending-items ul li:first-child span {  color:#ddab08;}

.dashboard-complete-items ul li:first-child { width: 70%; text-align: left; border-left: 5px solid #28975d}
    .dashboard-complete-items ul li:first-child span {  color:#28975d;}

section#dashboard-progress { padding: 30px; position: fixed; top: 57px; width: 300px; right: 0; bottom: 55px; overflow: auto; background:rgba(255,255,255,.5); }


.public-login-container { padding: 20px; margin-bottom: 20px; background:#fff; border-radius: 5px; -moz-border-radius: 5px; }

.list-of-license {  }
.list-of-license ul {margin: 0; padding: 0; list-style:none; }
    .list-of-license ul li { background:#fff; position:relative; padding: 30px; width: 250px; float:left; margin: 0 30px 30px 0; border: 1px solid #ccc; text-align:center;}
        .list-of-license ul li:last-child { }
        .list-of-license ul li img { width: 90px; height: auto; display:block; text-align:center; margin: 0 auto;}


/*Main Section*/
section#main-section { padding: 30px; position: absolute; top: 80px; left: 0; right: 0; max-width: 1000px; margin: 0 auto;}
.section-title { font-size: 2em; margin-bottom: 15px;}

nav#section-sub-nav { }
    nav#section-sub-nav a, nav#section-sub-nav button { display: inline-block; padding: 10px 0; margin-right: 10px; border: 0; border-bottom: 4px solid #dce2ec; background: none; text-decoration: none; color: #1758b4; font-size: 1em; cursor: pointer; }
        nav#section-sub-nav a.active, nav#section-sub-nav button.active { border-bottom: 4px solid #1758b4; color:#1758b4}
        nav#section-sub-nav a:last-child, nav#section-sub-nav button:last-child { margin-right: 0;}

div#content-container { padding: 30px; background:#fff;}


/*Application Header*/

#mainHeader {background: #0A4F92;    position: fixed;    top: 90px;    left: 0;    right: 0;    display: block; color:#fff;font-size: .8em; padding: 10px 30px;}
    #mainHeader div { display:inline-block; font-weight: 700; margin-right: 20px; }
        #mainHeader div span { display: block; font-weight: 400;}
        #mainHeader div a { color:#ddab08; text-decoration:none;}


/*Tabs*/
.tabs-container .tab-content { display: none; padding: 30px; background: #fff; }
.tabs-container .tab-content.active { display: block; }

/*Action Page*/
section#action-section {padding: 15px; position: fixed; top: 57px; left: 0; right: 300px; bottom: 53px; overflow: auto; }

.action-title-container { margin-bottom: 30px;}
.action-title { font-size: 1.75em;}
.action-title-details { color: #5e6777; font-size: .8em;}

fieldset.action-task-list { padding: 20px; border: 0; margin: 0; border-bottom: 1px solid rgba(0,0,0,.2); }
    fieldset.action-task-list:last-child {border-bottom:0; }

.action-task-list-title {text-transform: uppercase; font-size: .9em; font-weight: 700; text-transform:uppercase; margin-bottom: 20px;}
.action-task-list .form-item-container { margin-bottom: 1px; padding: 0 0 20px 30px; position: relative;}

    .action-task-list .form-item-container .task-status { position: absolute; font-size: 1.5em; left: 0;}
    .action-task-list .form-item-container .escalated {color:#cc0606;}
    .action-task-list .form-item-container .pending {color:#ddab08;}
    .action-task-list .form-item-container .completed {color:#28975d;}

section#action-details { padding: 15px; position: fixed; top: 57px; right: 0; bottom: 53px; width: 300px; overflow: auto; background: #dce2ec;}

.action-details-item { background:#fff; padding: 20px; margin-bottom: 15px;}
    .action-details-item.status { text-align:center;}
        .action-details-item.escalated { color:#cc0606}
    .action-details-item span { font-size: 3em;}

.tasks-due { text-align:center;}
.action-side-bar-number { font-size: 3em; font-weight: 700;}
.action-side-bar-tile { margin-bottom: 20px; }

.action-side-bar-progress { margin: 0; padding: 0; list-style:none;}
    .action-side-bar-progress li { border-bottom: 1px solid #dce2ec; text-align:left; padding: 15px 0;}    
.action-side-bar-progress span { font-size: 1em; margin-right: 7px;}
    .action-side-bar-progress span.escalated { color:#cc0606}
    .action-side-bar-progress span.pending { color:#ddab08}
    .action-side-bar-progress span.completed { color:#28975d}

/*Footer*/
footer { background:#0a1f3d; color:#fff; padding: 20px 30px; position: fixed; bottom: 0; left: 0; right: 0; font-size: .8em;}


/*Form Properties Styles*/
.form-section { margin-bottom: 15px; border-bottom: 1px solid #dce2ec; padding-bottom: 15px; }
    .form-section:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0;}
    
    /* Title | Description */
    .form-section-title { font-size: 1.5em; margin-bottom: 30px; font-weight: 700;}
    .form-section-description { padding-bottom: 30px; line-height: 1.45em; font-size: 1em;}
    
    /* Title | Data Filter */
    .form-section-title-block { display: flex; flex-flow: row wrap; margin-bottom: 30px; align-items: center; }
        
        .form-section-title-block .form-section-title { flex-grow: 1; margin: 0; }
        
        .form-section-title-block .form-section-filter { display: flex; }
            .form-section-filter button { padding: 10px 20px; border: 0; border-bottom: 2px solid #ccc; background: none; color: #1758b4; cursor: pointer; }
                .form-section-filter button.active { border-bottom: 2px solid #1758b4; }
    
    /* Data Statistics */
    .stats { display: flex; flex-flow: row wrap; margin-bottom: 2em; border-radius: 6px; overflow: hidden; }
        
        .stats .stat-item { flex: 1 1 auto; text-align: left; padding-right: 20px; }
        .stats .stat-item:last-child { border: 0; }
            .stats .stat-item .stat-num { display: block; color: #0a1f3d; font-size: 3em; font-weight: bold; }
            .stats .stat-item .stat-desc { font-size: 0.9em; text-transform:uppercase; border-bottom: 1px solid #ccd4e0; width: 100%; display:block; padding-bottom: 5px; margin-bottom: 5px;}
        
        .stats .stat-item.highlight { background: #26B78B; border: 0; color: #fff; }
            .stats .stat-item.highlight .stat-num { color: #fff; }
    
    /* Data Filters */
    .data-filter { display: flex; flex-flow: row wrap; background: #EBF0F7; margin-bottom: 50px; padding: 30px;}
        .data-filter .form-item-container { flex: 1 1 auto; width: 33%; padding-left: 1em; }
        .data-filter .form-item-container:first-child, .data-filter .form-item-container:nth-child(3n + 4) { padding-left: 0; }
            .data-filter .form-item-container label { font-size: 0.9em; font-weight: bold; }

.data-filter25 {
    display: flex;
    flex-flow: row wrap;
    background: #EBF0F7;
    margin-bottom: 50px;
    padding: 30px;
}

    .data-filter25 .form-item-container {
        flex: 1 1 auto;
        width: 25%;
        padding-left: 1em;
    }

        .data-filter25 .form-item-container:first-child, .data-filter25 .form-item-container:nth-child(4n + 5) {
            padding-left: 0;
        }

        .data-filter25 .form-item-container label {
            font-size: 0.9em;
            font-weight: bold;
        }
/* Form Items */
.form-item-container { margin-bottom: 20px;}
    .form-item-container label { display:block; margin-bottom: 7px; font-size: 1em;}
        .form-item-container label.required:before {content:"*"; padding-right: 10px; display: inline-block; color:#ff0000; }
    .form-item-container input[type="text"], .form-item-container input[type="password"], .form-item-container input[type="date"], .form-item-container input[type="email"], .form-item-container input[type="tel"],
    .form-item-container input[type="password"], select, textarea {
        display: block;
        width: 100%;
        padding: 10px;
        font-size: 1em;
    }

    .form-item-container input[type="date"] { max-width: 300px;}

    .form-item-container textarea { height: 75px;}

    .form-item-container blockquote:before { content: "Validation Notes: "; font-weight: 700;}
.form-item-container blockquote { padding: 0; font-size: .8em; font-style: italic; margin: 10px 0 0 0;}

.cb-item { float:left; margin-right: 20px;}
    .cb-item label { font-size: 1em;}

#radio-container {display: flex; justify-content: flex-start; flex-direction: row; margin-top: 12px;}
.cb-item2 { display: flex; justify-content: flex-start; margin-right: 25px;}
    .cb-item2 label {font-size: 1em; margin-left: 5px;}

.form-btn, button.button { padding: 10px 20px; border: 0; display: inline-block; background:#1758b4; color:#fff; border-radius: 3px;  -moz-border-radius: 3px; text-decoration:none; }
    .form-btn:hover, button.button:hover { background: #D10000; color: #fff; text-decoration:none; }
    
.form-btn.move-left, button.button.move-left {margin-right: 10px; }
.form-btn.move-right, button.button.move-right {margin-left: 10px; }

.main-table { width: 100%; border-collapse: collapse;}
    .main-table th { background:#0a4f92; color:#fff; text-align:left; padding: 8px;}
    .main-table td {border-bottom: 1px solid #ccc; padding: 8px; }

        .main-table tr:nth-child(even) { background:#f5f9ff}

/*Password Reset*/
#dialog .clear-after {margin: 0; padding: 0;}
#dialog .width50 {margin: 0 3%; width: 42%;}
    #dialog .form-item-container:nth-of-type(1) {margin-left: 0;}

    .k-dialog-titlebar {
        background-color: #0a1f3d;
        color: #ffffff;    
        padding: 15px;
    }
    
    .k-window-title.k-dialog-title {
        font-weight: 500;
    }
    
    .k-button-reset {
        width: 150px;
        padding: 8px;
        font-weight: 500;
        color: #ffffff;
        background-color:#0a1f3d;
    }
    
    .k-button-cancel {
        width: 150px;
        padding: 8px;
        font-weight: 500;
    }

/*General Styles*/
.clear-after:after {content:""; display:block; clear:both; }

.float-left { float:left;}
.float-right { float:right;}

.width67 { width: 67%; padding-right: 50px;}
.width60 { width: 60%;}
.width40 { width: 40%;}
.width25 { width: 25%;}
.width33, .width33b { width: 33%;}
.width50 {width:48%}
.width50:nth-child(1) {margin-right: 4%}

.width33 { width: 30%;}
.width33:nth-child(2) {margin: 0 5%;}

.red { color:#cc0606;}
.yellow { color:#ddab08;}
.green { color:#28975d;}


/*Admin Panels*/
.admin-form-view1 {padding: 30px; position: absolute; top: 138px; left: 0; width: 350px; bottom: 0; overflow: auto; max-width: 1000px; margin: 0 auto; background:#fff; }

section#main-section.admin-form-view2 {padding: 30px; position: absolute; top: 138px; left: 350px; right: 350px; bottom: 0; overflow: auto; max-width: 2400px; margin: 0 auto; }

.admin-form-view3 {padding: 30px; position: absolute; top: 138px; right: 0; width: 350px; bottom: 0; overflow: auto; background:#fff; }


nav#admin-nav { background:#031022; position: fixed; top: 90px; left: 0; right: 0; padding: 0 15px; display:block;}
nav#admin-nav a { display:inline-block; padding: 15px; color:#fff; text-decoration:none;}    


/*Dashboard*/
.admin-dashboard-btn {float:right; display:block; text-align:center; font-weight: 700; text-transform:uppercase; text-decoration:none;}

.admin-modal-title { text-align:center; margin-bottom: 30px;}
    .admin-modal-title span { display:block; font-size: .75em;}

.admin-modal-options { position:fixed; top: 91px; right: 280px; bottom: 0; left:280px; background: rgba(255,255,255,1); padding: 30px 0; overflow: auto; z-index: 99; display:none;}
.admin-modal-container { max-width: 1200px; margin: 0 auto;}

.column { display: flex;  flex-wrap: nowrap; width: 100%; display: flex;  align-items: center;  justify-content: center; background:#fff; margin-bottom: 10px; border: 1px solid #ccc;}
.column .col { width: 70%;}
    .column .col:hover { cursor:pointer;}

    .column .col:nth-child(1) { width: 30%; text-align:center; padding: 0 20px;}
        .column .col:nth-child(1) img { display:inline-block; text-align:center;}
        .column .col:nth-child(1) span { display:block; font-size: 1.5em; color:#D10000; text-transform:uppercase; font-weight: 700;}
            .column .col:nth-child(1) span::after { width: 40px; height: 5px; margin: 20px auto 0; background:#a5abb7; display:block; content:"";}

.uppercase {text-transform: uppercase;}
.smaller-type { font-size: .8em; }

.col-type-01 { background:#083C6F; padding: 30px; color:#fff; -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}
.col-type-02 { background:#083C6F; padding: 30px; color:#fff; -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}
.col-type-03 { background:#5752a2; padding: 30px; color:#fff; -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}
.col-type-04 { background:#26b78b; padding: 30px; color:#fff; -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}
.col-type-05 { background:#fdae1c; padding: 30px; color:#fff; -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}


/*Public Dashboard*/
.pub-dash-actions { padding-bottom: 50px; margin-bottom: 50px;}
    .pub-dash-actions h2 span { font-weight: 700;}

#dash-full-width { padding: 50px;}
.pub-dash-column { display: flex;  flex-wrap: nowrap; width: 100%; display: flex;  align-items: center;  justify-content: center; background:#fff; margin-bottom: 10px; border: 1px solid #ccc;}
.pub-dash-column .pub-dash-col { width: 20%; border-right: 1px solid #ccc;}
    .pub-dash-column .pub-dash-col:hover { cursor:pointer;}

.pub-dash-col .number { text-align:center; padding: 30px 0 70px; font-size: 3em; font-weight: 700; color:#ddab08; display:block; }
    .pub-dash-col .number::after { content:""; width: 75px; height: 5px; background:rgba(0,0,0,.2); margin: 15px auto 0; display:block;}

.pub-dash-col .icon {text-align:center; width: 100px; height: 100px; background:#fff; padding-top: 15px; border-radius: 300px; -moz-border-radius: 300px; overflow: hidden; margin-top: -50px; position: absolute; left: 50%; top: 0; margin-left: -50px; -webkit-box-shadow: 0 -10px 10px 0 rgba(0,0,0,.1);box-shadow: 0 -10px 10px 0 rgba(0,0,0,.1);}
.pub-dash-col .content-container { position: relative; padding: 60px 20px 20px 20px; color:#fff;  -webkit-box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2); box-shadow:inset 20px 20px 20px 0 rgba(0,0,0,.2);}
    .pub-dash-col .content-container h2 { font-weight: 700; text-align:center;}

.pub-dash-column .pub-dash-col:nth-child(1) .number {color: #ddab08; }
.pub-dash-column .pub-dash-col:nth-child(2) .number {color: #26b78b; }
.pub-dash-column .pub-dash-col:nth-child(3) .number {color: #5752a2; }
.pub-dash-column .pub-dash-col:nth-child(4) .number {color: #227aa4; }
.pub-dash-column .pub-dash-col:nth-child(5) .number {color: #3471b7; }

.pub-dash-column .pub-dash-col:nth-child(1) .content-container {background: #ddab08; }
.pub-dash-column .pub-dash-col:nth-child(2) .content-container {background: #26b78b; }
.pub-dash-column .pub-dash-col:nth-child(3) .content-container {background: #5752a2; }
.pub-dash-column .pub-dash-col:nth-child(4) .content-container {background: #227aa4; }
.pub-dash-column .pub-dash-col:nth-child(5) .content-container {background: #3471b7; }

/*public.html*/

#public-dashboard .form-btn {width: 200px; text-align: center; padding:10px 0 !important; margin-top: 20px;}

/*login.html*/

button.button
 { width: 150px; text-align: center; padding: 10px 0; border: 0; display: inline-block; background:#0A4F92; color:#fff; border-radius: 3px;  -moz-border-radius: 3px; font-weight: 500;}

/*Public Wizard*/
#wiz-nav a:first-child { margin-left: 0;}

#wiz-nav a {display:inline-block; padding: 10px 15px 10px 40px; text-decoration:none; position: relative; margin-left: -3px;}
    #wiz-nav a span { display:block; font-size: .8em;}
    #wiz-nav a::before { content:""; display:block; position:absolute; width: 18px; height: 18px; top: 13px; left: 15px; background: rgba(0,0,0,.2); border-radius: 2px; -moz-border-radius: 2px; text-align:center; font-size: .8em;}

    
    
    #wiz-nav a.step-pending { background:#fff;}

        #wiz-nav a.step-pending::before { background:#ddab08; }

        #wiz-nav a.step-complete { background:#28975d; color:#fff;}
        #wiz-nav a.step-complete::before { content:"\2713"; }

.btn-start-app { background:#0A4F92; padding: 10px 15px; color:#fff; display:inline-block;margin: 15px 0 0; text-decoration:none;}
    .btn-start-app:hover { color:#fff; background:#D10000; text-decoration:none;}

/*Fonts*/
@charset "UTF-8";

@font-face {
  font-family: "rhodes";
  src:url("fonts/rhodes.eot");
  src:url("fonts/rhodes.eot?#iefix") format("embedded-opentype"),
    url("fonts/rhodes.woff") format("woff"),
    url("fonts/rhodes.ttf") format("truetype"),
    url("fonts/rhodes.svg#rhodes") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before {
  font-family: "rhodes" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "rhodes" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-alert:before {
  content: "\61";
}
.icon-check:before {
  content: "\62";
}


.errorr {
    height:17px;
    margin-left:9px;
    padding:1px 5px 0px 5px;
    font-size:small;
    color: red;
}

span.arrow {
    margin-left: 6px;
    height:17px;
}
label.error {
    height:17px;
    margin-left:9px;
    padding:1px 5px 0px 5px;
    font-size:small;
    color: red;
}





.invalid {
    border-style: solid;
    border-width: 2px;
    border-color: red;
}


.notifyjs-corner {
    left: 50% !important;
    transform: translateX(-50%);
    z-index: 99999999 !important;
}

#overlay {
    height: 100%;
    width: 100%;
    position: fixed; /* Stay in place */
    z-index: 100000; /* Sit on top */
    left: 0;
    top: 0;
    background: rgba(141, 141, 141, 0.4);
    overflow-x: hidden; /* Disable horizontal scroll */
    display: none;
}


#loader {
    position: fixed;
    opacity: 1;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: 16px solid #a7a5a5;
    border-radius: 50%;
    border-top: 16px solid rgba(77, 57, 194, 1);
    width: 120px;
    height: 120px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

#progress-container {
    left: 50%;
    position: fixed;
    top: 58%;
    background: #a7a5a5;
    height: 15px;
    width: 300px;
    transform: translateX(-50%);
    display: none;
}

#progress {
    background: green;
    height: 100%;
    width: 0%
}

.group-title {
    font-weight: 900;
}

.test-box {
    border: 1px solid black;
    background-color: #f6f6f6;
    padding: 10px;
    margin-top: 20px;
}

.modal2 {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: rgba(0,0,0,.6);
    /*z-index: 10;*/
    display: none;
}

.modalContainer2 {
    width: 900px;
    margin: 0 auto;
    background: #fff;
    padding: 3em;
    margin-top: 3em;
    position: relative;
    overflow: auto;
    max-height: 100%;
}

.modal {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: rgba(0,0,0,.6);
    /*z-index: 99;*/
    display: none;
    overflow-y: scroll;
}

.modalContainer {
    width: 600px;
    margin: 0 auto;
    background: #fff;
    padding: 3em;
    margin-top: 3em;
    position: relative;
    overflow: auto;
    max-height: 100%;
}

.modalContainerWithTopMargin {
    width: 600px;
    margin: 0 auto;
    background: #fff;
    padding: 3em;
    margin-top: 9em;
    position: relative;
    overflow: auto;
    max-height: 100%;
}

.remove-link {
    text-decoration: none;
    color:red;
}

.inline-div {
    display: inline !important;
    margin-right: 0px !important;
}
