.branding-method-box {
    display: inline-block;
    width: 80px;
    height: 80px;
    border-radius: 2px;
    overflow: hidden;
    vertical-align: middle; /* for Safari */
}
.branding-method-box *{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.branding-method-box.branding-method-enl {
    background: #609DB4;
}
.branding-method-box.branding-method-spr {
    background: #B3C768;
}
.branding-method-box.branding-method-emb {
    background: #d23f12;
}
.branding-method-box.branding-method-emb .branding-method-icon {
    margin-top: -6px;
}
.branding-method-box.branding-method-dpr {
    background: #117bde;
}
.branding-method-box .branding-method-label {
    padding: 8px 0px 0px 0px;
    text-align: center;
    color: #fff;
    overflow: hidden;
    font-weight: normal;
    font-size: 11px;
    line-height: 14px;
    text-shadow: 0px 1px 1px #666;
    text-transform: uppercase;
    height: 36px;
}
.branding-method-box .branding-method-icon {
    margin-top: 5px;
    color: #fff;
    font-size: 30px;
    text-shadow: 0px 1px 1px #666;
    text-align: center;
}
/* I have to specifically set style for .fa here, isn't it overkill to set .fa globally in main_css.css? */
.branding-method-box .branding-method-icon .fa {
    top: inherit;
    color: #fff;
    font-size: 30px;
}
.branding-method-box .photo-printing-colors {
    height: 44px;
    padding-top: 7px;
}
.branding-method-box .photo-printing-colors div {
    display: inline-block;
    float: left;
    width: 25%;
    height: 100%;
}
.branding-method-box .photo-printing-colors div:nth-child(1) {
    background-color: #1ed0c6;
    border-bottom-left-radius: 2px;
}
.branding-method-box .photo-printing-colors div:nth-child(2) {
    background-color: #f504d0;
}
.branding-method-box .photo-printing-colors div:nth-child(3) {
    background-color: #fff32b;
}
.branding-method-box .photo-printing-colors div:nth-child(4) {
    background-color: #000;
    border-bottom-right-radius: 2px;
}

/** Mini size **/
.branding-method-box.branding-method-box-mini {
    width: 32px;
    height: 32px;
}
.branding-method-box.branding-method-box-mini .branding-method-icon .fa {
    top: inherit;
    color: #fff;
    font-size: 23px;
}
.branding-method-box.branding-method-box-mini .branding-method-icon {
    margin-top: 4px;
    font-size: 23px;
}
.branding-method-box.branding-method-box-mini .photo-printing-colors {
    height: 18px;
    padding-top: 0px;
}

/* for twipsy */
.branding-method-box {
    position: relative;
    overflow: visible;
}
.branding-method-box:hover .twipsy{
    display: block;
}
.branding-method-box .twipsy .twipsy-inner{
    width: 300px;
}