body {
  background-color: #eaeae5;
}

a:link {
  #color: #4c315a;
  color: #000000;
  background-color: transparent;
  text-decoration: none;
}
a:visited {
  color: blue;
  background-color: transparent;
}
a:hover {
  color: red;
  background-color: transparent;
}
a:active {
  color: green;
  background-color: transparent;
}

table {
  margin: 0px 0px 0px 0px;
  border-collapse: collapse;
}

table.font110 {
  font-size: 110%;
}

.th-form {
  border: none;
}

.td-form {
  border: none;
}

.thx {
  padding: 8px 16px 8px 16px;
  border: 1px solid #a0a0a0;
  border-collapse: collapse;
}

.tdx {
  padding: 8px 16px 8px 16px;
  border: 1px solid #a0a0a0;
  border-collapse: collapse;
}

th,td {
  border: 1px solid #c0c0c0;
  border-collapse: collapse;
}

table.auto {
    table-layout: auto;
    #width: 100%;    
}

td.pad16 {
  padding: 4px 16px 4px 4px;
}

td.check {
    width: 10%;
}

td.choice {
    width: auto;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.label {
  white-space: initial;
}

.rerendercheck { 
   transform: translateZ(0);
   #z-index: 0;
}

div.fixed {
  position: fixed;
  #top: 0;
  left: 0;
  #width: 300px;
  #border: 3px solid #73AD21;
}

img.center-img-50 {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.flex-container {
  display: -webkit-flex;
  display: flex;  
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  text-align: center;
  font-size: 100%;
  #background: #f8f8f8;
  background: white;
}

.flex-container-int {
  display: -webkit-flex;
  display: flex;  
  -webkit-flex-flow: column wrap;
  flex-flow: column wrap;
  text-align: center;
  padding: 0px 0px 0px 0px;
}

.flex-container > * {
  #padding: 2px;
  -webkit-flex: 1 100%;
  flex: 1 100%;
}

.flex-item {
  text-align: left;
  background: white;
  color: #000070;
  font-size: 100%;
  border: 1px solid black;
}

.flex-item-center {
  #text-align: center;
  #background: white;
  color: #000000;
}

.flex-item:first-child {
    margin-right: auto;
}

.home {
  text-align: left;
	background: #f8f8f8;
	color: #000070;
}

.bg-img {
  background-image: url("kaa/assets/img/chicago-7.jpg");
  background-position: center top;
  background-repeat: no-repeat;
  object-fit: contain;
  #max-height: 100%;
  max-width: 100%;
  #align-items: center;
}

.iheader-carousel {
  background: #dedcd8;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 220px;
  width: 100%;
  max-width: 100%;
  font-family: "Times New Roman", Times, serif;
  font-size: 120%;
  color: white;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.iheader-dashboard-carousel {
  position:relative; 
  overflow:hidden;
  background: #dedcd8;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  height: 220px;
  width: 100%;
  max-width: 100%;
  font-family: "Times New Roman", Times, serif;
  font-size: 120%;
  color: white;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.iheader {
  background-image: url("../img/head-chicago.3.jpeg");
  background: #dedcd8;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  #object-fit: contain;
  height: 200px;
  width: 100%;
  max-width: 100%;
  font-family: "Times New Roman", Times, serif;
  font-size: 120%;
  color: white;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.thumbnail {
  background: #dedcd8;
  background-position: center;
  background-size: initial;
  background-repeat: no-repeat;
  max-height: 100%;
  width: 100%;
  max-width: 100%;
  color: white;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.dashboard-updates {
  #object-fit: contain;
  max-width: 100%;
  #border: 1px solid #c0c0c0;
  border: 1px solid black;
  background: #ded9ce;
  color: #000000;
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  padding: 6px 4px 6px 4px; 
  margin: 0px 0px 0px 0px; 
}

.dashboard-overall-progress {
  border: 2px solid #c0c0c0;
  background-color: white;
  width: 100%;
  text-align: left;
  vertical-align: center;
  #-webkit-flex-flow: column wrap;
  #flex-flow: columm wrap;
  font-size: 100%;
  padding: 0px 8px 0px 8px; 
  margin: 1px 0px 0px 0px; 
}

.dashboard-forms-progress {
  border: 2px solid #c0c0c0;
  background-color: white;
  width: 100%;
  text-align: left;
  vertical-align: center;
  #-webkit-flex-flow: column wrap;
  #flex-flow: columm wrap;
  font-size: 100%;
  padding: 0px 8px 0px 8px; 
  margin: 1px 0px 0px 0px; 
}

.db-message {
  border: 2px solid #c0c0c0;
  background-color: white;
  width: 100%;
  text-align: left;
  font-size: 80%;
  padding: 0px 8px 0px 8px; 
  margin: 1px 0px 0px 0px; 
}

.dropdown {
  position: relative;
  #display: inline-block;
  #float: left;
}

.dropdown-toggle {
  #float: left;
  position: relative;
  background-color: transparent;
  border-color: transparent;
  #border-style: solid;
  border-top: none;
  border-right: none;
  border-left: none;
  border-bottom: none;
}

.indent64 {
  margin: 0px 64px 0px 64px;
  font-size: 100%;
}

.mission {
  #border: 1px solid #c0c0c0;
  color: #000000; 
  font-size: 130%;
  text-align: left;
  padding: 0px 0px 16px 16px;
  margin: 6px 64px 6px 64px;
}

.mission-2 {
  color: #000000;
  font-size: 120%;
  text-align: left;
  padding: 8px 8px 8px 16px;
  margin: 6px 64px 6px 64px;
  border: 1px solid #c0c0c0;
}


.footer {
  background: #eaeae5;
  color: #000000; 
  margin: 0px 0px 0px 0px;
  padding-top: 4px; 
  padding-bottom: 4px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 90%;
  text-align: center;
  vertical-align: bottom;
  #border-top: 1px solid #d0d0d0;
  #border-bottom: 1px solid #d0d0d0;
  max-width: 100%;
}

.removebtn {
  color: #b00000;
  position: absolute;
  top: 0;
  right: 0;
  width:13px;
  height: 13px;
  text-align:center;
  border-radius:25%;
  font-size: 10px;
  font-weight: bold;
  cursor: pointer;
  background-color: #ffffff;
}  

.payment-table {
  margin: 8px 8px 8px 8px;
  border: 1px solid black;
  border-collapse: collapse;
}

.payment-table tr {
  font-family: "Courier New", Courier, monospace;
}
.payment-table td {
  padding: 8px 16px 8px 16px;
}

.admin-nav {
  background-color: #fdfdfd;
  font-size: 100%;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0px 0px 0px 0px;
  width: 100%;
  height: 48px !important;
  min-height: 48px !important;
}

.nav, .navbar {
  background-color: #fdfdfd;
  font-size: 100%;
  font-family: Arial, Helvetica, sans-serif;
  margin: 0px 0px 0px 0px;
  width: 100%;
  height: 56px !important;
  min-height: 56px !important;
}

#.navbar-brand, .nav > li > a {
#  #padding: 15px 15px;
#  padding: 4px 4px;
#}

.nav ul {
  list-style-type: none;
  padding: 0;
}
.nav ul a {
  text-decoration: none;
	color: #000070;
}

.help-frame {
  text-align:left;
  border: 1px solid #c0c0c0;
  background-color: #f8f8f8;
}

.input-frame {
  text-align:left;
  border: 1px solid #c0c0c0;
  #background-color: #e8ece8;
  #background-color: #d8dfd8;
  background-color: #d0d0df;
  padding: 4px 12px 4px 12px;
  margin: 0px 32px 0px 32px;
}

.input-frame-children {
  text-align:left;
  border: 1px solid #c0c0c0;
  #background-color: #c8c8c8;
  background-color: #d8ded8;
}

.more-readable {
  font-size: 130%;
}

hr.sep-gray {
  border: 1px solid #c0c0c0;
}

hr.sep-black {
  border: 2px solid #000000;
}

hr.sep-blue {
  border: 2px solid #0000a0;
  #border-radius: 2px;
}

hr.sep-green {
  border: 2px solid #00a000;
}

hr.sep-red {
  border: 2px solid #a00000;
}

.div-prop-noborder {
  border: 0;
  border-collapse: collapse;
}

.div-prop-data {
  border-collapse: collapse;
  border-top: 1px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  text-align: center;
}

.div-prop-data-right-cell {
  border-collapse: collapse;
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  text-align: center;
}

.div-prop-header {
  border-collapse: collapse;
  border-top: 1px solid #c0c0c0;
  border-right: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  text-align: center;
}

.div-prop-header-right-cell {
  border-collapse: collapse;
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  text-align: center;
}

.div-prop-border {
  border: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.div-prop-border-top {
  border-top: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.div-prop-border-right {
  border-right: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.div-prop-border-bottom {
  border-bottom: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.div-prop-border-left {
  border-left: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.asset-debt-valign {
  vertical-align: bottom;
}

.pad2px { padding: 2px; }

.pad-totals { padding: 6px 6px 6px 6px; }


.summary-cell { 
  text-align: right;
  #vertical-align: bottom;
  font-weight: bold;
  padding-right: 16px; 
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  border-left: 1px solid #c0c0c0;
  border-collapse: collapse;
}

.propertydivision-category-header {
   padding: 8px 8px 8px 8px;
   border-top: 1px solid #c0c0c0;
   border-left: 1px solid #c0c0c0;
   border-right: 1px solid #c0c0c0;
}

.prop-div-hdr {
  text-align: left;
  color: #000000;
  background: #f0f0f0;
}
 
.prop-div-th {
  text-align: center;
}
.prop-div-td-num {
  text-align: right;
}
.prop-div-td-str {
  text-align: center;
}

##clientshowdivorcedetails {
#  display: none !important;
#}
#
##spouseshowdivorcedetails {
#  display: none !important;
#}

@media all and (min-width: 768px) {
    .home {text-align:left;-webkit-flex:1 auto;flex:1 auto;-webkit-order:1;order:1;}
    .nav {text-align:center;-webkit-flex:1 auto;flex:1 auto;-webkit-order:2;order:2;}
    .flex-container-int {text-align:center;-webkit-flex:6 auto;flex:6 auto;-webkit-order:3;order:3;}
    footer {-webkit-order:4;order:4;}
}

img {
  max-width: 100%;
  object-fit: contain;
  display: block;
}

.logo-img {
  object-fit: contain;
  float: left;
  padding: 8px 2px 8px 8px;
  #border: 1px solid #c0c0c0;
}


.img-takeaction {
  margin: 0px 0px 0px 0px;
  opacity: 0.4;
  object-fit: cover;
  #object-fit: contain;
  #object-fit: scale-down;
  border: 1px solid #c0c0c0;
}

.img-float-left {
  object-fit: contain;
  float: left;
}

.red-question {
  display: block;
  width: 20px;
  height: 20px;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.img-red-check {
  object-fit: contain;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  border: 1px solid #e00000;
  background-color: #000000;
  float: left;
  border-radius: 4px;
  cursor: pointer;
  -webkit-box-shadow: -1px 1px 1px 1px #a0a0a0;
  -moz-box-shadow: -1px 1px 1px 1px #a0a0a0;
  box-shadow: -1px 1px 1px 1px #a0a0a0;
}

.img-red-x {
  object-fit: contain;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.img-check {
  object-fit: contain;
  float: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  border: 1px solid #c0c0c0;
}

.img-center {
  margin-left: auto;
  margin-right: auto;
  float: left;
  object-fit: contain;
  #object-fit: cover;
  #object-fit: scale-down;
}

.img-right {
  object-fit: scale-down;
  float: right;
  margin: 2px 16px 2px 16px;
}

.img-left {
  object-fit: contain;
  float: left;
  margin: 0px 32px 0px 0px;
  #border: 1px solid #0000ff;
}

.img-head-right {
  position: absolute;
  object-fit: contain;
  float: right;
  padding: 0px 0px 0px 0px;
  margin: 8px 12px 8px 2px;
}

.img-head-left {
  position: absolute;
  top: 12px;
  left: 8px;
  object-fit: contain;
  float: left;
  padding: 0px 0px 0px 0px;
  margin: 8px 2px 8px 12px;
}

.img-head-left-modal {
  object-fit: contain;
  float: left;
  padding: 0px 0px 0px 0px;
  margin: 2px 2px 2px 8px;
  #border: 1px solid black;
}


.image-cell {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto; 
  background-color: #f8f8f8;
  max-width: 100%;
}

.flex-image {
  display: flex;
  flex-flow: row wrap;
  max-width: 100%;
  align-items: center;
}

.faq {
  #-webkit-box-flex: 1;
  #-moz-box-flex: 1;
  #-webkit-flex: 1 1 auto;
  #flex-flow: row wrap;
  #flex: 1 1 auto; 
  padding: 0px 0px 0px 0px;
  margin: 0px 64px 0px 64px;
  text-align: left;
  font-size: 120%;
  font-weight: bold;
  object-fit: contain;
  #border: 1px solid #c0c0c0;
  line-height: 1.6;
}

.faq-format {
  text-align: left;
  font-size: 110%;
  font-weight: bold;
}

.faq-box {
  border: 1px solid #c0c0c0;
  background-color: #ffffff;
  padding: 4px 4px 4px 8px;
  font-size: 90%;
  font-weight: normal;
  line-height: 1.6;
}

.faq-head {
  font-size: 160%;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  padding: 8px 64px 8px 64px;
}

.faq-line {
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  font-weight: bold;
}

.box-no-outline {
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  #border: 1px solid #c0c0c0;
  border: 1px solid black;
  font-size: 100%;
  #max-width: 100%;
  width: 100%;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  #background: #ded9ce;
  background: #efe6d6;
}

.header-box-outline {
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  max-width: 100%;
  width: 100%;
  padding: 0px 0px 8px 0px;
  margin: 0px 0px 0px 0px;
  #border: 1px solid #c0c0c0;
}

.temp-box-outline {
  border: 1px solid #c0c0c0;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.inner-box-outline {
  border: 1px solid #c0c0c0;
  padding: 4px 12px 4px 12px;
  margin: 4px 4px 4px 4px;
}

.box-outline {
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  padding: 0px 0px 0px 0px;
  #border: 1px solid #c0c0c0;
}

.admin-box-outline {
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  border-top: 1px solid #c0c0c0;
  border-bottom: 1px solid #c0c0c0;
  font-size: 100%;
  max-width: 100%;
  width: 100%;
  padding: 0px 0px 00px 0px;
  margin: 0px 0px 0px 0px;
  background: #e8e8e8;
}

/*
.scrolling-form-data {
  position: relative;
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  border: 1px solid #c0c0c0;
  font-size: 110%;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 8px;
  padding-left: 0px;
  #margin: 0px 0px 0px 0px;
  background: #ded9ce;
}

.modal-box-outline {
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
  #border: 1px solid #c0c0c0;
  font-size: 80%;
  padding-top: 4px;
  padding-right: 16px;
  padding-bottom: 8px;
  padding-left: 16px;
  margin: 2px;
  background: #ded9ce;
}

.modal-title {
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  #border: 1px solid #c0c0c0;
  font-size: 100%;
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  #margin: 2px;
  background: #ded9ce;
}
*/

.getstarted {
/*
  -webkit-flex-flow: column wrap;
  flex-flow: columm wrap;
*/
  border: 2px solid #c0c0c0;
  background-color: #c0c0c0;
  width: auto;
  #padding: 8px 8px 8px 8px;
  margin: 8px 8px 16px 16px;
  #color: #4c315a;
  #color: black;
  float: left;

}

hr { 
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 2px;
}

.parenting-plan-box {
  font-size:100%;
  margin:4px 4px 4px 4px;
  padding:4px 4px 6px 8px;
  border:1px solid #c0c0c0;
  background-color:#fcfcfc;
}

.csc-box {
  font-size:100%;
  margin:4px 4px 4px 4px;
  padding:4px 4px 6px 8px;
  border:1px solid #c0c0c0;
  #background-color:#e0e6e0;
  #background-color:#d8ded8;
  background-color:#e8ece8;
}

.csc-title {
  font-size:120%;
  color: #000070;
}

.divider {
  border-bottom: 1px solid #c0c0c0;
}

.standard-border {
  border:1px solid #c0c0c0;
}

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

.red-asterisk {
  color:#b00000;
  font-size:120%;
  font-weight:bold;
}

.dropdown-menu {
  #white-space: nowrap;
  #width: 100%;
  color: black;
}

#mmenu a:visited { color:#000000; }

/* Modal User/Pass Input
 Full-width input fields */
input[type=text], input[type=password] {
    width: 100%;
    padding: 16px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

.input-group-border {
  border: 1px solid #c0c0c0; 
  padding: 8px 8px 16px 12px;
  #background-color: #e8e8e8;
  background-color: #f0f0f0;
}

.border-gray {
  border: 1px solid #c0c0c0;
  border-collapse: collapse;
  padding: 2px;
}

.pbarstyle {
  #width: 0%;
  width: 100px;
  display: block;
  height: 24px;
  text-align: center;
  vertical-align: top;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 90%;
  font-weight: bold;
}

/*
.admin-header {
  text-align:right;
  font-size:110%;
}

.admin-info {
  #font-weight: bold;
  #background-color: #dbd;
  font-size: 100%;
  background: white;
  color: #000000;
}

.dashboard-header {
  #border:1px solid #c0c0c0;
  background: white;
  #background: #a0a0a0;
  color: #000000;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 120%;
  padding: 0px 8px 0px 8px;
  margin: 0px 0px 0px 0px;
}

.dashboard-header-left {
  text-align:right;
  font-size:100%;
}

.dashboard-header-center {
  text-align:center;
  font-size:160%;
  font-weight: bold;
  vertical-align: top;
}

.dashboard-header-right {
  text-align: center;
  font-size: 110%;
  font-family: "Times New Roman", Times, serif;
  font-weight: bold;
}
*/
/*
.carousel.carousel-fade .item {
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    -ms-transition: opacity 0.5s ease-in-out;
    -o-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    opacity:0;
}

.carousel.carousel-fade .active.item {
    opacity:1;
}

.carousel.carousel-fade .active.left,
.carousel.carousel-fade .active.right {
    left: 0;
    z-index: 2;
    opacity: 0;
    filter: alpha(opacity=0);
}

.carousel.carousel-fade .next,
.carousel.carousel-fade .prev {
    left: 0;
    z-index: 1;
}

.carousel.carousel-fade .carousel-control {
    z-index: 3;
}
*/

/* Set a style for all buttons */
button {
  border: 3px solid blue;
  background-color: #4C315a;
  color: white;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 100%;
  border-radius: 6px;
  cursor: pointer;
  width: auto;
  height: auto;
  padding: 4px 4px 4px 4px;
  margin: 8px 8px 24px 16px;
  #-webkit-box-shadow: -1px 1px 5px 4px #a0a0a0;
  #-moz-box-shadow: -1px 1px 5px 4px #a0a0a0;
  #box-shadow: -1px 1px 5px 4px #a0a0a0;

}

button:hover {
  opacity: 0.8;
}

.homebtn {
  border: 3px solid #600000;
  background-color: #efe6d6;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

.help-popup {
  text-align: left;
  background-color: #ffffff;
  padding: 4px 8px 4px 8px;
}

.recalc-totals-btn {
  border: 1px solid #00ff00;
  #border: 1px solid #59b459;
  #background-color: #eb951a;
  #background-color: #fda72c;
  background-color: #59b459;
  #background-color: #79d479;
  color: #000000;
  font-size: 90%;
  font-weight: bold;
  padding: 2px 8px 2px 8px;
  margin: 2px 2px 2px 2px;
}

.goto-top-btn {
  border: 2px solid #00a0a0;
  background-color: #f0f0f0;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

.recalc-re-btn {
  border: 3px solid #0000a0;
  background-color: white;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

.recalc-rt-btn {
  border: 3px solid #900090;
  background-color: white;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

.recalc-as-btn {
  border: 3px solid #00a000;
  background-color: white;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

.recalc-de-btn {
  border: 3px solid #a00000;
  background-color: white;
  color: black;
  font-size: 80%;
  font-weight: bold;
  padding: 2px 4px 2px 4px;
  margin: 2px 2px 2px 2px;
}

/* Extra styles for the cancel button */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
  color: white;
  #position: absolute;
  #right: 35px;
  #bottom: 0px;
  float: right;
}	

.menubtn:active {
  transform: translateX(4px) translateY(4px);
}

.qualifybtn:active {
  transform: translateX(4px) translateY(4px);
}

.getstartedbtn:active {
  transform: translateX(4px) translateY(4px);
}

.modaldonebtn:active {
  transform: translateX(4px) translateY(4px);
}

.modalnokidsbtn:active {
  transform: translateX(4px) translateY(4px);
}

.modalkidsbtn:active {
  transform: translateX(4px) translateY(4px);
}

.modalcancelbtn:active {
  transform: translateX(4px) translateY(4px);
}

/* Override default button styles */
.qualifybtn {
  border: 3px solid #000090;
  background-color: #337ab7;
  color: #f0f0f0;
  font-weight: bold;
  float: left;
  padding: 2px 6px 2px 6px;
}

.checkbtn {
  #border: 1px solid #e0e000;
  #background-color: #efa843;
  border: 1px solid #a0a0a0;
  background-color: #700000;
  color: #f0f0f0;
  font-weight: normal;
  float: left;
  padding: 6px 12px 6px 12px;
  #margin-right: 16px;
}

.getstartedbtn {
  border: 1px solid #c0c000;
  background-color: #006000;
  color: white;
  font-weight: bold;
  float: left;
  padding: 2px 8px 2px 8px;
}

.modalokbtn {
  #border: 3px solid #00b000;
  #background-color: #009000;
  #color: white;
  font-size: 90%;
  border: 3px solid blue;
  background-color: #000090;
  color: white;
  padding: 2px 6px 2px 6px;
}

.menubutton {
  border: 3px solid white;
  background-color: #00d000;
  #color: white;
  float: left;
}

.menubtn {
  border: 3px solid #7fc0fa;
  background-color: #337ab7;
  color: #ffffff;
  #font-weight: bold;
  padding: 6px 12px 6px 12px;
  margin: 8px 8px 0px 8px;
}

.consultationhelpbtn {
  border: 3px solid #7fc0fa;
  #background-color: #337ab7;
  background-color: #205f97;
  color: #ffffff;
  #font-weight: bold;
  padding: 2px 8px 2px 8px;
  margin: 0px 0px 0px 0px;
}

/* Main menu button */
.dashboard-menu {
  object-fit: contain;
  background: #7fc0fa;
  #background: #ded9ce;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
}

.menubtnmenu {
  border: 3px solid #7fc0fa;
  background-color: #337ab7;
  color: #ffffff;
  padding: 6px 12px 6px 12px;
  margin: 8px 8px 0px 8px;
}

/* Center the image and position the close button */
.imgcontainer {
    text-align: left;
    margin: 0px 0px 12px 0px;
    position: relative;
}

img.avatar {
    width: 40%;
    border-radius: 50%;
}

.container {
  width: 100%;
  max-width: 100%;
}

.thumb-docs {
  text-align: center;
  font-weight: bold;
  display: table-cell;
  width: 25%;
  vertical-align: top;
}

span.psw {
    float: right;
    padding-top: 16px;
}

.tabulator-col-title {
  text-align: center;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    max-height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  position: relative;
  background-color: #c8c8c8;
  margin: 8% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
  padding: 0px 1px 0px 1px;
  #border: 1px solid #888;
  width: 50%; /* Could be more or less, depending on screen size */
  max-width: 50%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.close {
    position: absolute;
    right: 8px;
    top: 0;
    color: #000;
    font-size: 35px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: red;
    cursor: pointer;
}

/* Add Zoom Animation */
.animate {
    -webkit-animation: animatezoom 0.4s;
    animation: animatezoom 0.4s
}

@-webkit-keyframes animatezoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}
    
@keyframes animatezoom {
    from {transform: scale(0)} 
    to {transform: scale(1)}
}

/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
    span.psw {
       display: block;
       float: none;
    }
    .cancelbtn {
       width: 100%;
    }
}
/*
.modalheader {
  text-align: center;
  background-image: url("../img/oldlawbooks.png");
  background-size: cover;
  object-fit: contain;
  max-width: 100%;
  #width: 100%;
  font-size: 100%;
  color: #f8f8f8;
  border: 1px solid #888;
}
*/