/* ------------------------------------------------------------ *\
	Infobox
\* ------------------------------------------------------------ */

.infobox {
    display: flex;
    flex-direction: row;
    padding: 30px;
    margin: 30px 0;
}

.infobox.mint {background-color: #66c0ba; color: #fff; }
.infobox.sun {background-color: #fcc41e; color: #fff; }
.infobox.sky {background-color: #7bb8e5; color: #fff; }
.infobox.candy {background-color: #e1516d; color: #fff;  }
.infobox.space {background-color: #3b4395; color: #fff;  }
.infobox.gray {background-color: #4a5762; color: #fff;  }

.infobox.mint h3,
.infobox.space h3,
.infobox.gray h3,
.infobox.candy h3,
.infobox.sky h3,
.infobox.sun h3 {color: #fff; }

.infobox-image {
    flex: 1 0 150px;
    margin-right: 20px;
}

.infobox-image img {
    max-width: none;
}

@media (max-width: 479px) {
     .infobox {
       flex-direction: column;
       /*padding: 0;*/
     }

    .infobox-image {
       margin-right: 0;
        text-align: center;
        flex: 1 0 100px;
    }

    .infobox-image img {
       max-width: 120px;
    }
 }