@base_font_size: 12px;
@base_color: #666;
@base_font_family: sans-serif;
@base_line_height: 1;
@title_font_size: 20px;

/*      wrapper
 *------------------------------------*/
#mgpc-wrapper {
    padding: 0;
    margin-top: 25px;
    margin-bottom: 25px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/*      rest
 *------------------------------------*/
#mgpc {
    a {
        margin: 0;
        text-decoration: none;
    }

    p {
        margin: 0px 0px 5px 0px;
        line-height: @base_line_height;
        font-size: @base_font_size;
        color: @base_color;
    }
    p, a {
        padding: 0;  
        font-weight: normal;
        line-height: @base_line_height;
        font-size: @base_font_size;
        color: @base_color;
    }
}



/*      mgpc
 *------------------------------------*/
#mgpc {
    padding: 0px 15px 0px 15px;
    margin: 0;
    border: 1px solid lighten(@base_color, 50%);
    border-radius: 5px;

    .mgpc-title {
        padding: 15px 0 15px 0;
        margin: 0;
        border-bottom: 1px solid lighten(@base_color, 50%);
    }
    
    .mgpc-title {
        .title {
            color: #555;
            font-family: @base_font_family;
            line-height: @title_font_size;
            font-weight: normal;
            margin: 0;
            padding: 0;
            text-shadow: none;
            font-size: @title_font_size;
        }
    }

    /* list wrapper */
    .mgpc-list-wrapper {
        margin: 15px 0;
        padding: 0;
    }
    .mgpc-list {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
    .mgpc-list {
        .mgpc-author {
            display: table-cell;
            margin: 0;
            padding: 0px 10px;
            vertical-align: top;
        }
    }
    
    /* main-block */
    .mgpc-block {
        display: table-cell;
        vertical-align: top;
    }

    /* author-block */
    .author-block {
        .author-name {
            margin: 0;
            padding: 0;
            font-size: 16px;
            line-height: 1;
            color: #555;
            font-family: inherit;
            font-weight: 600;
        }
        .author-role {
            font-size: 11px;
            font-weight: normal;
            margin: 0;
            padding: 0;
            color: #979797;
            font-family: inherit;
        }
        .description {
            margin-bottom: 10px;
            font-family: inherit;
            line-height: 16px;
            font-weight: normal;
            font-style: italic;
            color: #666;
            font-size: 12px;
            margin-top: 5px;
            margin-bottom: 10px;
            text-align: justify;
        }
        .email .mgpc-icon,
        .website .mgpc-icon {
            margin-right: 3px;
            color: @base_color;
        }
        .email, .website {
            margin-bottom: 5px;
            font-style: italic;
        }
    }

    /*  Social Links
     *----------------------------*/
    .social-links-wrapper {
        margin-top: 10px;
    }
    .social-links {
        margin: 0;
        padding: 0;
        list-style-type: none;

        li.mgpc-social-link {
            margin: 0px 5px 5px 0px;
            display: inline-table;
            text-align: center;
            height: 30px;
            width: 30px;
            line-height: 32px;

            &:last-child {
                margin-right: 0px;
            }

            a {
                color: #fff;
                font-size: @base_font_size + 2;
                margin: 0;

                i.mgpc-icon {
                    color: #fff;
                    line-height: 30px;
                }
            }

        }

        /*      Social Links */
        .facebook {
            background: #5677B3;
        }
        .twitter {
            background: #37A2D4;
        }
        .wordpress {
            background: #555;
        }
        .linkedin {
            background: #397EFA;
        }
        .youtube {
            background: #FF4949;
        }
        .pinterest {
            background: #DF3434;
        }
        .instagram {
            background: rgb(87, 84, 90);
        }
        .tumblr {
            background: rgb(73, 97, 133);
        }
        .flickr {
            background: rgb(226, 83, 112);
        }
        .skype {
            background: #28A2E7;
        }

 
    }
}


/* view */
.verticle-block {
  float: left; 
}
.horizontal-block {
  float: none; 
}
.verticle-spacing {
  margin-left: 0px;
}
.horizontal-spacing {
  margin-left: 10px;
  margin-right: 10px;
}