.card-box,
    .card-box.i {
        width: 270px;
        height: 300px;
        padding: 20px 0px;
        background: white;
        background: #f90;
        /*background: linear-gradient(to top, #f90, #fff, #f90);*/
        float: left;
        position: relative;
        margin-right: 5px;
        border-top-right-radius: 30px;
        border-bottom-left-radius: 30px;
        /*border: 1px solid #f90;*/
    }

    .card-box.i {
        background: #09f;
        /*background: linear-gradient(to top, #09f, #fff, #09f);*/
        /*background: white;*/
        /*border: 1px solid #09f;*/
    }

    .card-box img,
    .card-box.i img {
        width: 100px !important;
        height: 100px;
        background-size: cover;
        border-radius: 50%;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        /*border: 4px solid #f90;*/
        text-align: center;
         /*box-shadow: 0px 0px 2px 2px #f90; */
        background: #f90;        
    }

    .card-box.i img {
        border-color: #09f;
        background: #09f;
    }

    .box-container {
        width: 100%;
        margin-top: 58px;
        padding: 60px 5% 10px;
        background: #fffa;
        text-align: center;
        box-sizing: border-box;
    }

    .box-container h2,
    .box-container h5 {
        font-family: arial;
        color: #000a;
    }

    .box-container h4 {
        font-family: cursive;
        font-size: 14px;
        color: #0008;
    }

    .box-container h3 {
        font-size: 16px;
    }

    .box-container a.social {
        width: 13px;
        height: 13px;
        background: #fffa;
        display: inline-block;
        line-height: 13px;
        border: 2px solid #f90;
        padding: 10px;
        border-radius: 50%;
        color: #f90;
    }

    .card-box.i .box-container a.social {
        border-color: #09f;
        color: #09f;
    }

    .box-container a.social:hover,
    .card-box.i .box-container a.social:hover {
        color: #0008;
    }