* {
    padding: 0;
    margin: 0
}

.container-fluid {
    background-color: #000000
}

#heading,
#heading0 {
    color: #ffffff
}

.card {
    background-color: #E8EAF6;
    padding-top: 0px;
    cursor: pointer
}

.card-name:hover {
    color: #424242
}

#card1 {
    border-top: 4px solid rgb(29, 201, 228) !important;
    transition: 0.3s
}

#card1:hover {
    box-shadow: 0 0 2px 2px rgb(29, 201, 228);
    transition: 0.3s
}

#card2 {
    border-top: 4px solid #00E676 !important;
    transition: 0.3s
}

#card2:hover {
    box-shadow: 0 0 2px 2px #00E676;
    transition: 0.3s
}

#card3 {
    border-top: 4px solid #AB47BC !important;
    transition: 0.3s
}

#card3:hover {
    box-shadow: 0 0 2px 2px #AB47BC;
    transition: 0.3s
}

#card4 {
    border-top: 4px solid #fcff62 !important;
    transition: 0.3s
}

#card4:hover {
    box-shadow: 0 0 2px 2px #fcff62;
    transition: 0.3s
}

#card5 {
    border-top: 4px solid #FF5656 !important;
    transition: 0.3s
}

#card5:hover {
    box-shadow: 0 0 2px 2px #FF5656;
    transition: 0.3s
}

#card6 {
    border-top: 4px solid #c89300 !important;
    transition: 0.3s
}

#card6:hover {
    box-shadow: 0 0 2px 2px #c89300;
    transition: 0.3s
}

#card7 {
    border-top: 4px solid #A0CE4E !important;
    transition: 0.3s
}

#card7:hover {
    box-shadow: 0 0 2px 2px #A0CE4E;
    transition: 0.3s
}

#card8 {
    border-top: 4px solid #769DBB !important;
    transition: 0.3s
}

#card8:hover {
    box-shadow: 0 0 2px 2px #769DBB;
    transition: 0.3s
}

#card9 {
    border-top: 4px solid rgb(3,149,134) !important;
    transition: 0.3s
}

#card9:hover {
    box-shadow: 0 0 2px 2px rgb(3,149,134);
    transition: 0.3s
}

#card10 {
    border-top: 4px solid rgb(0, 95, 86) !important;
    transition: 0.3s
}

#card10:hover {
    box-shadow: 0 0 2px 2px rgb(0, 95, 86);
    transition: 0.3s
}

#card11 {
    border-top: 4px solid rgb(24, 175, 252) !important;
    transition: 0.3s
}

#card11:hover {
    box-shadow: 0 0 2px 2px rgb(24, 175, 252);
    transition: 0.3s
}

#card12 {
    border-top: 4px solid rgb(255, 203, 244) !important;
    transition: 0.3s
}

#card12:hover {
    box-shadow: 0 0 2px 2px rgb(255, 203, 244);
    transition: 0.3s
}

.hex-icon {
    background-color: black;
    width: 30%
}

.fa {
    color: white;
    background-color: black;
    width: 40px;
    transition: 0.2s
}

.fa:hover {
    opacity: 1;
    transition: 0.2s
}

.fa-facebook {
    background-color: #4267B2;
    opacity: 0.8
}

.fa-twitter {
    background-color: #1DA1F2;
    opacity: 0.8
}

.fa-linkedin {
    background-color: #0077B5;
    opacity: 0.8
}

.fa-pinterest {
    background-color: #E60023;
    opacity: 0.8
}

svg {
    height: 200px;
    width: 240px
}