/*----------------------------------------------------------------------------*	CIRCLE ICONS SHORTCODE
\*----------------------------------------------------------------------------*/
.mpc-circle-icons { position: relative; width: 90%; margin: 0 auto; border-radius: 50%; }

.mpc-circle-icons:before { content: ''; display: block; position: absolute; top: 4%; left: 4%; width: 92%; height: 92%; border-radius: 50%; z-index: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.mpc-circle-icons:after { content: ''; display: block; padding-top: 100%; }

.mpc-circle-icons .mpc-icon { position: absolute; top: 50%; left: 50%; z-index: 2; }

.mpc-circle-icons .mpc-icon .mpc-regular img, .mpc-circle-icons .mpc-icon .mpc-hover img { max-width: none; }

.mpc-circle-icons .mpc-icon-column { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

@media screen and (min-width: 769px) { .mpc-column:not(.vc_col-lg-12) .mpc-circle-icons .mpc-icon-column, .mpc-column:not(.vc_col-md-12) .mpc-circle-icons .mpc-icon-column { background: none !important; padding: 0 !important; margin: 0 !important; border: none !important; border-radius: 50% !important; } }

.mpc-circle-icons .mpc-icon-column.mpc-active .mpc-icon-column__content-wrap { visibility: visible; opacity: 1; }

.mpc-circle-icons .mpc-icon-column__content-wrap { visibility: hidden; opacity: 0; border-radius: 50% !important; overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; transition: all 1s; }

.mpc-circle-icons .mpc-icon-column__content-wrap:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; }

.mpc-circle-icons .mpc-icon-column__content { display: inline-block; vertical-align: middle; position: relative; z-index: 1; max-height: 100%; overflow: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.mpc-circle-icons .mpc-icon-column__content::-webkit-scrollbar { width: 6px; }

.mpc-circle-icons .mpc-icon-column__content::-webkit-scrollbar { background: rgba(255, 255, 255, 0.35); border-radius: 3px; }

.mpc-circle-icons .mpc-icon-column__content::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.5); border-radius: 3px; }

/* FrontEnd Editor */
.mpc-circle-icons .vc_element.vc_mpc_icon_column { display: inline-block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Mobile */
@media screen and (max-width: 768px) { .mpc-column .mpc-circle-icons.mpc-circle-icons { width: 100%; }
  .mpc-column .mpc-circle-icons.mpc-circle-icons:before, .mpc-column .mpc-circle-icons.mpc-circle-icons:after { display: none; }
  .mpc-column .mpc-circle-icons.mpc-circle-icons .mpc-icon-column { position: relative; border-radius: 0 !important; padding: 2em; margin: 2em 0; }
  .mpc-column .mpc-circle-icons.mpc-circle-icons .mpc-icon { position: relative; top: 0 !important; left: 0 !important; margin-left: 0 !important; margin-top: 0 !important; margin-bottom: 2em; }
  .mpc-column .mpc-circle-icons.mpc-circle-icons .mpc-icon-column__content-wrap { visibility: visible; opacity: 1; border-radius: 0 !important; border: none !important; margin: 0 !important; padding: 0 !important; width: 100%; height: auto; background: none !important; }
  .mpc-column .mpc-circle-icons.mpc-circle-icons .mpc-icon-column__content-wrap:before { display: none; } }
