#sec-banner {
    text-align: center;
    padding-top: 1em;
    padding-bottom: 1em;
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 180s ease infinite;
    color: #fff;
}
@keyframes gradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; } 
}

#sec-banner h1 { font-size: 1.7em; }
#sec-banner h2 { font-size: 1.3em; }


.card { margin-bottom: 20px; background-color: #fafafa; }
.card .icon { font-size: 25px;}
.card h5 {font-size: 1.1em;}
.card p {font-size: .95em;}
.card .col-sm-3:nth-of-type(1) { max-width: 100px; min-width: 100px;}
.card { background-color: #fafafa; border-left: solid 4px #23d5ab; animation: bordercolor 180s ease infinite; }
.card:hover { box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;}

@keyframes bordercolor {
    0% { border-left: solid 4px #23d5ab; }
    15% { border-left: solid 4px #23a6d5; }
    30% { border-left: solid 4px #e73c7e; }
    50% { border-left: solid 4px #ee7752; }
    70% { border-left: solid 4px #e73c7e; }
    85% { border-left: solid 4px #23a6d5; }
    100% { border-left: solid 4px #23d5ab; } 
}


#sec-tools { margin-top: 1em; }

#sec-social { margin-top: 2em; }
#sec-social .addthis_sharing_toolbox { margin: 2em 0; }
#sec-social hr { width: 70%; margin: 0 auto; }

#sec-howto { margin-top: 4em; }
#sec-howto h4 { margin-bottom: 2em;}
#sec-howto  h5 {text-align:center; margin-top: 1em;}

.navbar { margin-bottom: 0 !important; }