/* Site welcome */

.abstract-blocks {
    overflow: hidden;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
}

.banner {
    margin: 0 auto;
    text-align: center;
}

.banner .container {
    padding: 32px;
    max-width: 808px;
}

.banner h1 {
    font-size: 50px !important;
    margin: 20px 0 16px;
    font-weight: bold;
    line-height: 1.17;
    color: #03192d;
} 

[data-md-color-primary=black] .banner h1 {
    color: #fff !important;
}


.banner-h2 {
    font-size: 1.5625em;
    margin: 20px 0 16px;
    line-height: 1.4;
    font-weight: 600;
    text-align: center;
} 

[data-md-color-primary=black] .banner-h2 {
    color: #fff !important;
}

.banner-p {
    font-size: 20px;
    line-height: 1.6;
    color: #4e5e6c;
}

[data-md-color-primary=black] .banner-p {
    color: #fff !important;
}

/* Product card grid */

.products {
    padding-bottom: 144px;
}

.container {
    margin: 0 auto;
    width: 100%;
}

.products .container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(440px, 100%), 1fr));
    grid-gap: 24px;
    padding: 0 24px;
    position: relative;
}

@media only screen and (max-width: 1170px) {
    .products .container {
       display: inline-table !important;
    }
  }

@media only screen and (max-width: 640px) {
    .products .card .card-img {
       display: none;
    }
  }

.products .card {
    display: flex;
    border-radius: 8px;
    margin-bottom: 5px;
    overflow: hidden;
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 10%), 0 8px 10px -6px rgb(0 0 0 / 10%);
    border: solid 1pt #aaa;
    background-color: #fff;
    z-index: 1;
    height: 400px;
    padding-top: 20px;
    padding-bottom: 20px;
}

/*
.products .card .card-img {
    align-self: stretch;
    min-width: 150px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
    background-size: 90px;
}
*/


/*
.products .container .light-blue-shadow {
    left: -200px;
    top: -240px;
    width: 708px;
    height: 863px;
    background-image: radial-gradient( circle at 48% 50%, #2aa2c1, rgba(42, 162, 193, 0) 76% );
}

.products .container .blue-shadow {
    right: -50px;
    top: -250px;
    width: 667px;
    height: 702px;
    background-image: radial-gradient( circle at 48% 50%, #337fe6, rgba(51, 127, 230, 0) 71% );
}

.products .container .pink-shadow {
    left: -50px;
    bottom: -250px;
    width: 667px;
    height: 702px;
    background-image: radial-gradient( circle at 48% 50%, #be46dd, rgba(190, 70, 221, 0) 71% );
}

.products .container .neon-shadow {
    right: -50px;
    bottom: -250px;
    width: 667px;
    height: 702px;
    background-image: radial-gradient( circle at 48% 50%, #d5ea48, rgba(213, 234, 72, 0) 71% );
}
*/

.banner-p {
    font-size: 20px;
    line-height: 1.6;
    color: #4e5e6c;
}

.products .card .content {
    width: 100%;
    display: flex;
    flex-direction: column;
    padding-left: 20px;
}

.card-p {
    margin: 0 0 12px 0;
    opacity: 0.7;
    font-size: 16px;
    line-height: 1.75;
    color: #000;
}

[data-md-color-primary=black] .card-p {
    margin: 0 0 12px 0;
    opacity: 0.7;
    font-size: 16px;
    line-height: 1.75;
    color: #000 !important; 
}

.products .card .links {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    grid-gap: 24px 15px;
    font-size: 12pt;
}

@media only screen and (max-width: 700px) {
    .products .card .links {
       display: grid;
       height: 400px;
       overflow: hidden;
       overflow-y: scroll;
       padding-bottom: 10px;
       margin-bottom: 5px;
    }
  }

.products .card .links ul {
    max-height:100px;
    overflow:auto;
}

.products .card .links a img {
    margin-right: 6px;
    width: 20px;
    vertical-align:middle;
}

.index-h2 {
    color: #404040;
    font-size: 2rem;
    font-weight: 300;
    padding-bottom: 15px;
}

.index-h2 img {
    float: left;
    width: 60px;
    margin-right: 20px;
    margin-top: 10px;
}

@media only screen and (max-width: 640px) {
    .products .card .index-h2 img {
       display: none;
    }
  }

.home-button  {
    border: 0.1rem solid;
    background-color: #fff !important;
    border-radius: 0.1rem;
    color: var(--md-primary-fg-color);
    cursor: pointer;
    display: inline-block;
    font-weight: 800;
    padding: 0.625em 2em;
    align-items: center;
    
}

.home-button:hover {
    background-color: #447099  !important;
    cursor: pointer;
    color: #fff !important;
    border-radius: 0.1rem;
}