/*------------------------------------
- COLOR primary
------------------------------------*/
.alert-primary {
  color: #131940;
  background-color: #b2bae8;
  border-color: #a3abe3;
}

.alert-primary hr {
  border-top-color: #8f9add;
}

.alert-primary .alert-link {
  color: #070a19;
}

.badge-primary {
  color: #fff;
  background-color: #303f9f;
}

.badge-primary[href]:hover,
.badge-primary[href]:focus {
  color: #fff;
  background-color: #242f77;
}

.bg-primary {
  background-color: #303f9f !important;
}

a.bg-primary:hover,
a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
  background-color: #242f77 !important;
}

.border-primary {
  border-color: #303f9f !important;
}

.btn-primary {
  color: #fff;
  background-color: #303f9f;
  border-color: #303f9f;
}

.btn-primary:hover {
  color: #fff;
  background-color: #4652b1;
  border-color: #4350b3;
}

.btn-primary:focus,
.btn-primary.focus {
  box-shadow: 0 0 0 0.2rem rgba(48, 63, 159, 0.5);
}

.btn-primary.disabled,
.btn-primary:disabled {
  color: #fff;
  background-color: #303f9f;
  border-color: #303f9f;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #4652b1;
  border-color: #4350b3;
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(48, 63, 159, 0.5);
}

.btn-outline-primary {
  color: #303f9f;
  background-color: transparent;
  border-color: #303f9f;
}

.btn-outline-primary:hover {
  color: #fff;
  background-color: #303f9f;
  border-color: #303f9f;
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
  box-shadow: 0 0 0 0.2rem rgba(48, 63, 159, 0.5);
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
  color: #303f9f;
  background-color: transparent;
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #fff;
  background-color: #303f9f;
  border-color: #303f9f;
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(48, 63, 159, 0.5);
}

.list-group-item-primary {
  color: #131940;
  background-color: #a3abe3;
}

.list-group-item-primary.list-group-item-action:hover,
.list-group-item-primary.list-group-item-action:focus {
  color: #131940;
  background-color: #8f9add;
}

.list-group-item-primary.list-group-item-action.active {
  color: #fff;
  background-color: #131940;
  border-color: #131940;
}

.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: #a3abe3;
}

.table-hover .table-primary:hover {
  background-color: #8f9add;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
  background-color: #8f9add;
}

.text-primary {
  color: #303f9f !important;
}

a.text-primary:hover,
a.text-primary:focus {
  color: #242f77 !important;
}

/* ======================================= */

body {
  background: #f9f9fb;
}

.cards-wrapper.row {
  display: flex;
  flex-wrap: wrap;
}

.bg-light {
  box-shadow: 0 0 10px rgba(8, 8, 8, 0.25);
  background-color: #303f9f !important;
}
.navbar {
  height: 55px;
}
.navbar-nav .nav-link {
  color: white !important;
  font-weight: 500 !important;
}
.navbar .navbar-brand {
  color: white;
  font-size: 20px;
  font-weight: 500;
}
nav.navbar .container {
  color: white;
}
.navbar-light .navbar-brand:hover {
  color: #f3d748;
}
.navbar-light .navbar-nav .nav-link:hover {
  color: #f3d748 !important;
}

.nav-logo {
  max-width: 225px;
}
.nav-image {
  width: 100%;
}
.cards-section .title {
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 24px;
  font-weight: 600;
}
.cards-section .intro {
  margin: 0 auto;
  max-width: 800px;
  margin-bottom: 60px;
  color: #616670;
}
.cards-section .cards-wrapper {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.cards-section .item {
  margin-bottom: 30px;
}
.cards-section .item .icon-holder {
  margin-bottom: 15px;
}
.cards-section .item .icon {
  font-size: 52px;
}
.cards-section .item .title {
  font-size: 16px;
  font-weight: 600;
}
.cards-section .item .intro {
  margin-bottom: 15px;
}
.cards-section .item-inner {
  height: 12rem;
  padding: 45px 10px;
  background: #fff;
  position: relative;
  border: 1px solid #f0f0f0;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.cards-section .item-inner .link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
/*  */
.cards-section .item-primary .item-inner {
  border-top: 3px solid #40babd;
}
.cards-section .item-primary .item-inner:hover .title {
  color: #2d8284;
}
.cards-section .item-primary .item-inner:hover {
  background: #2d828414;
}
.cards-section .item-primary .icon {
  color: #40babd;
}
/*  */
.cards-section .item-green .item-inner {
  border-top: 3px solid #75c181;
}
.cards-section .item-green .item-inner:hover .title {
  color: #48a156;
}
.cards-section .item-green .item-inner:hover {
  background: #48a15614;
}
.cards-section .item-green .icon {
  color: #75c181;
}
/*  */
.cards-section .item-blue .item-inner {
  border-top: 3px solid #58bbee;
}
.cards-section .item-blue .item-inner:hover .title {
  color: #179de2;
}
.cards-section .item-blue .item-inner:hover {
  background: #179de214;
}
.cards-section .item-blue .icon {
  color: #58bbee;
}
/*  */
.cards-section .item-orange .item-inner {
  border-top: 3px solid #f88c30;
}
.cards-section .item-orange .item-inner:hover .title {
  color: #d46607;
}
.cards-section .item-orange .item-inner:hover {
  background: #d4660714;
}
.cards-section .item-orange .icon {
  color: #f88c30;
}
/*  */
.cards-section .item-red .item-inner {
  border-top: 3px solid #f77b6b;
}
.cards-section .item-red .item-inner:hover .title {
  color: #f33a22;
}
.cards-section .item-red .item-inner:hover {
  background: #f33a2214;
}
.cards-section .item-red .icon {
  color: #f77b6b;
}
/*  */
.cards-section .item-pink .item-inner {
  border-top: 3px solid #ea5395;
}
.cards-section .item-pink .item-inner:hover .title {
  color: #d61a6c;
}
.cards-section .item-pink .item-inner:hover {
  background: #d61a6c14;
}
.cards-section .item-pink .icon {
  color: #ea5395;
}
/*  */
.cards-section .item-purple .item-inner {
  border-top: 3px solid #8a40a7;
}
.cards-section .item-purple .item-inner:hover .title {
  color: #5c2b70;
}
.cards-section .item-purple .item-inner:hover {
  background: #5c2b7014;
}
.cards-section .item-purple .icon {
  color: #8a40a7;
}
/*  */
.cards-section .item-brown .item-inner {
  border-top: 3px solid #84662B;
}
.cards-section .item-brown .item-inner:hover .title {
  color: #795c24;
}
.cards-section .item-brown .item-inner:hover {
  background: #84662b33;
}
.cards-section .item-brown .icon {
  color: #84662B;
}
/*  */
.cards-section .item-dark-red .item-inner {
  border-top: 3px solid #b10000;
}
.cards-section .item-dark-red .item-inner:hover .title {
  color: #b10000;
}
.cards-section .item-dark-red .item-inner:hover {
  background: #ff000017;
}
.cards-section .item-dark-red .icon {
  color: #b10000;
}
/*  */
.cards-section .item-dark-blue .item-inner {
  border-top: 3px solid #0E0FD1B3;
}
.cards-section .item-dark-blue .item-inner:hover .title {
  color: #1900ffe5;
}
.cards-section .item-dark-blue .item-inner:hover {
  background: #220ed113;
}
.cards-section .item-dark-blue .icon {
  color: #0E0FD1B3;
}
/*  */
.cards-section .item-dark-green .item-inner {
  border-top: 3px solid #007C11;
}
.cards-section .item-dark-green .item-inner:hover .title {
  color: #006e0f;
}
.cards-section .item-dark-green .item-inner:hover {
  background: #007c111e;
}
.cards-section .item-dark-green .icon {
  color: #007C11;
}
/*  */


/* Extra small devices (phones, less than 768px) */
@media (max-width: 767px) {
  .cards-section .item-inner {
    padding: 30px 15px;
  }
}
