nav.submenu ul li a {font-size: 12px !important;}


.jumbotron h1 {font-weight: 400 !important; letter-spacing: -0.08rem; color: #666;}
h2 {font-weight: 400; letter-spacing: -0.08rem; color: #666;}

ul, ol {font-size: 16px; margin-top: 20px; margin-left: 0px; padding-left: 0px;}
ul li, ol li {margin-bottom:0.7em;  margin-left: 20px !important;}

#content li ul {
  margin-bottom: 40px; /* - used to format indected bulleted lists but broke the nav dropdown so disabled*/
}


.card {width: auto; float: none; border: 1px solid #ccc;}
      .card:hover {border: 1px solid #aaa;}

      .card.share .card-header:hover {
        background: none;
        cursor: default;
      }
      .card p {margin-bottom: 15px !important;}

      .card .date {
          opacity: .6;
          display: block;
          font-size: 12px;
          font-family: arial;
      }

      .card .relationship {
          margin-top: 20px;
          opacity: .45;
          display: block;
          font-size: 12px;
          font-family: arial;
      }

      .card .ul + p {margin-top: 20px;}



      .card.share .card-footer:hover {
        background: none;
      }

      
li.divider {border-top: 1px solid #ddd; margin-top: 10px !important; margin-bottom: 10px !important;}



.crumbtrail {background-color: #666; padding-top: 9px; padding-bottom: 10px; margin-top: 120px; }
.crumbtrail ul {margin: 0; padding: 0;}
.crumbtrail li {display: inline; float: none; font-size: 600;}
.crumbtrail a {color: #eee;}
.crumbtrail a:hover {color:#fff;}
.crumbtrail a:after {content: " > "; margin-left: 7px; margin-right: 7px;}


.affix {
     position: relative;
     top: 50px;
  }



.keywords {margin-top: 30px; margin-bottom: 30px;}
.keyword-pill {display: inline-block; border: 1px solid #999; border-radius: 15px; padding: 5px 15px 6px; font-size: 12px; white-space: nowrap; margin-right: 6px; margin-bottom: 10px;}

.nowrap {white-space: nowrap;}

.progress {margin-bottom: 15px;}
.progress.progress-small {
    height: 3px;
}

.table {margin-top: 30px;}
.table th {font-size: 600; font-weight: normal;}


#footer h6 {color: #eee !important; font-weight: 400;}
#footer h6 a {color: #eee;}
#footer h6 a:hover {color: #fff;}
#footer ul.no-style {padding-left: 0px !important;}
#footer li a {color: #666;}
#footer li a:hover {color: #fff !important;}
#footer ul li {margin-left: 0px !important;}

#cover-page-logo { margin-top: 50px; margin-bottom: 50px; }


.thumbnail-container {background-color: #eee; padding: 60px 60px; margin-bottom: 40px; min-height: 450px; text-align: center;}

ul.doc-list {list-style-type: none; margin-top: 10px;}
ul.doc-list li.doctype-pdf:before {    
    font-family: 'FontAwesome';
    content: '\f1c1';
    margin: 0 0.4em 0.2em -1.2em;
    color: #d10d0d;
    font-size: 1.1rem;
}


#container-backtotop-link {
  text-align: right;
}

a.backtotop {font-size: 16px; color: #eee !important;}
a.backtotop:hover {color:#fff !important;}
a.backtotop i.fa {margin-right: 7px;}

.highlight {background-color: #f6f1cd; padding: 2px 7px 3px;}

@media (max-width: 991px) {
  body.menu-opened .header .menu > li > .classic {
      top: -5px !important; }
  .menu-content.mobile-dark {
      background-color: #333 !important;
  }

  #cover-page-logo {margin-top: 10px; margin-bottom: 10px; transform: scale(0.8);}
  .header.dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):visited, .header.light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):visited, .header.light-solid .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):visited, .header.transparent-dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):visited, .header.transparent-light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):visited, .header.dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):focus, .header.light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):focus, .header.light-solid .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):focus, .header.transparent-dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):focus, .header.transparent-light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn):focus {
    color: #ddd !important;}
  li.divider {border-top: 1px solid #30343d; margin-top: 10px !important; margin-bottom: 10px !important;}

  #portfolio-nav .text-label-previous {display: none;}
  #portfolio-nav .text-label-next {display: none;}
  #nav-portfolio-previous:before {content:"<";}
  #nav-portfolio-next:after {content:">";}

  #container-backtotop-link {
    text-align: center;
  }

}

.header .menu > li > a {
font-weight: 400;
}

.quote:hover {
color: #222 !important;
}

.quote-handwriting {
  font-family: "Dancing Script", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

.quote-color-gradient {
  
    background-image: -webkit-linear-gradient(0.25turn, #3f87a6, #ebf8e1,#f69d3c);
    background-image: linear-gradient(0.25turn, #3f87a6,#ebf8e1,#f69d3c);
    background-position: right center;
    background-size: 400% auto;
    -webkit-background-clip: text;
    background-clip: text;
    transition: color 200ms linear;
}
  
    .quote-color-gradient:hover {
      background-position: left center;
      transition: background-position 2000ms ease-out;
    }

.table.usability-metrics {
  margin-top: 80px;
}

  .table.usability-metrics {
    th, td {text-align: right;}
  }



  .table.usability-metrics .metric {
    width: 20%;
    text-align: left !important;
  }


  .table.usability-metrics .column-1 {
    width: 20%;
    text-align: right;
    color: #999 !important;
  }

  .table.usability-metrics .column-2 {
    width: 25%;
    text-align: right;
    color: #222 !important;
  }

  .table.usability-metrics .column-3 {
    width: 15%;
    text-align: right;
    color: rgb(3, 72, 119);
    font-weight: 300 !important;
  }

  .table.usability-metrics .column-4 {
    width: 20%;
    text-align: left;
    
  }

  .table.usability-metrics .progress {
    margin-top: 8px;
  }

    .table.usability-metrics .progress-bar-success {
      background-color: rgba(3, 72, 119,0.7);
    }



  .table.risk-metrics {
    margin-top: 60px;
  }
  
    .table.risk-metrics {
      th, td {text-align: left;}
    }
  
  
  
    .table.risk-metrics .metric {
      width: 20%;
      
    }
  
  
    .table.risk-metrics .column-1 {
      width: 25%;
      
      color: #999 !important;
    }
  
    .table.risk-metrics .column-2 {
      width: 25%;
      
      color: #222 !important;
    }
  
    .table.risk-metrics .column-3 {
      width: 30%;
      
      color: rgb(3, 72, 119);
      font-weight: 300 !important;
    }
  
    



.table tbody tr:hover th, .table tbody tr:hover td {background-color: rgb(240, 246, 250);}
.col-group-start {
  border-left: 1px solid #eee;
}


#laurel-trophy {
  opacity: 0.10;
}

  #laurel-trophy:hover {
    opacity: 0.15;
  }

.shimmer {
  color: grey;
  display: inline-block;
  mask: linear-gradient(-60deg, #000 40%, #0005, #000 55%) right/350% 100%;
  animation: shimmer 4s infinite;
  font-size: 50px;
  max-width: 600px;
}

@keyframes shimmer {
  100% {
    mask-position: left
  }
}


#section-testimonials-preview .post-card {

}

#section-testimonials-preview .post-card-body {
  position: relative;
  background: #fff;
  border: 2px solid #e5e9ee;
  border-radius: 8px;
  padding: 0px 15px 10px;
  color:rgba(11, 63, 100, 0.9);
  box-shadow: 0px 8px 16px rgb(229, 233, 238, 0.5);

}
  #section-testimonials-preview .post-card-body:hover {
    color:rgb(2, 50, 82) !important;
    box-shadow: 0px 8px 16px rgb(229, 233, 238, 1);
  }


  #section-testimonials-preview .post-card-body::before,
  #section-testimonials-preview .post-card-body::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 18px;
    border: 12px solid transparent;
    border-bottom-color: #e5e9ee;
  }



  #section-testimonials-preview .post-card-body::after {
    left: 20px;
    border: 10px solid transparent;
    border-bottom-color: #fff;
  }




@media (max-width: 991px) {
.header.dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn).active, .header.light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn).active, .header.light-solid .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn).active, .header.transparent-dark .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn).active, .header.transparent-light .menu-content.mobile-dark.mobile-dark .menu > li > a:not(.btn).active {
    background-color: #222;
    color: #aaa;
}

@media (max-width: 991px) {
.menu-content.mobile-dark .menu > li.classic > nav ul, .menu-content.mobile-dark .menu > li.horizontal > nav, .menu-content.mobile-dark .menu > li.mega .container {
    background-color: #333 !important;}

#header .header-inner ul.menu > li.open.classic > nav.classic {border-color: transparent !important;}

#header ul li.classic.open nav.classic ul li a {color: #aaa !important;}
  #header ul li.classic.open nav.classic ul li a:hover {color: #fff !important;}
  #header ul li.classic.open nav.classic ul li a.active {color: #fff !important;}

#header .header-inner ul.menu li.classic a {color: #aaa !important;}
    #header .header-inner ul.menu li.classic a:hover {color: #fff !important;}
    #header .header-inner ul.menu li.classic a.active {color: #fff !important;}

#header .header-inner ul.menu li a {color: #aaa !important;}
  #header .header-inner ul.menu li a:hover {color: #fff !important;}
  #header .header-inner ul.menu li a.active {color: #fff !important;}

#header ul li.classic.open nav li.divider {border-top: 1px solid #393939;}
}



@media (max-width: 768px) {

  .thumbnail-container {background-color: #eee; padding: 2em 1em; margin-bottom: 40px; min-height: auto; text-align: center;}
}