Discord with Accordion Menu CSS [Solved]

[Gremalkyn]

I am using Leif's Mini-Profile code, but the rest of the Mini-Profile is not what I have questions on, only the CSS for the Accordion Menu: which is why I brought it up here. o

On the test site the code runs as intended and yet the exact same code doesn't function on the live site.

Test site CSS:

A:hover {text-decoration: none;}
A:hover, .info, .group1:hover font, .group4:hover font, .group5:hover font, .group8:hover font, .group9:hover font, .group10:hover font, .group11:hover font, .group12:hover font, .group13:hover font, .group14:hover font, .group15:hover font, A, .group1 font, .group4 font, .group5 font, .group8 font, .group9 font, .group10 font, .group11 font, .group12 font, .group13 font, .group14 font, .group15 font, a img, a:hover img {
transition: all 1.0s ease;
-moz-transition: all 1.0s ease;
-o-transition: all 1.0s ease;
-webkit-transition: all 1.0s ease;
}
A:hover, .info a:hover, .group1:hover font, .group4:hover font, .group5:hover font, .group8:hover font, .group9:hover font, .group10:hover font, .group11:hover font, .group12:hover font, .group13:hover font, .group14:hover font, .group15:hover font {
color:#b094ea;
}
a img {
filter: alpha(opacity=60);
opacity: 0.6;
border: 0;
}
a:hover img {
filter: alpha(opacity=100);
opacity: 1.0;
}

.usergroup {
   text-transform: capitalize; letter-spacing: 3px; padding-left:7px; text-align: right; font: impact;
}

.leifbox a { text-align: center; }


.leifbox a:link, a:visited {
   color: #000000;
}
.leifbox A:hover {text-decoration: none;}
.leifbox A:hover, a img, a:hover img {
transition: all 1.0s ease;
-moz-transition: all 1.0s ease;
-o-transition: all 1.0s ease;
-webkit-transition: all 1.0s ease;
}
.leifbox A:hover {
color:#FFFFFF;
}
.leifbox a img {
filter: alpha(opacity=60);
opacity: 0.6;
border: 0;
}
.leifbox a:hover img {
filter: alpha(opacity=100);
opacity: 1.0;
}

.ppinside { width:200px; height:375px; opacity:0;
   transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -webkit-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
}
.ppinside:hover { width:200px; height:375px; opacity: 1; background-color:#52374d;
   transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -webkit-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
}
.ppinside { width:200px; height:375px; margin:auto; text-align:center; }
.leifbox { width: 85px; height:20px; overflow:hidden; float:left; z-index:1; text-align:center; margin-left:10px;line-height:20px; margin-top:5px;}
div.leifbox { background-color: #2c2a48; color: #ffffff; text-align:center; }
.leifbox select {
  background: #212429;
  width: 75px;
  border: 0;
  border-radius: 0;
  height: 20px;
  color: #e6e8e3;
   }
.leifbox { margin-top:5px; margin-bottom:5px;
}
.ac-container{
  width: 100%;
  margin: 5px auto 5px auto;
}
.ac-container label{
  font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
  padding: 5px 5px 5px 5px;
  position: relative;
  z-index: 20;
  display: block;
   margin-left:-5px;
  height: 20px;
  cursor: pointer;
//   text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
  line-height: 20px;
//   font-size: 19px;
}
//.ac-container label:hover{ background: #5F512E; }
.ac-container input{ display: none; }
.ac-container article{
  //background: rgba(37, 37, 39, 0.5);
  margin-top: -1px;
  overflow: hidden;
  height: 0px;
  position: relative;
  z-index: 10;
  -webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}
.ac-container article.article-show{
  -webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
}
.ac-container article p{
  font-style: italic;
  color: #EFEFEF;
  line-height: 23px;
  width:200px;
  height: 220px;
  font-size: 11px;
  padding: 3px;
  margin-top: -10px;

}
.ac-container article.article-show{ height: 175px; overflow:hidden; margin:auto; }

div.profilehead, .profilehead a, .profilehead a:visited .profilefoot a, .profilefoot a:visited, .profilefoot,  {
   font-size: 25px;
   vertical-align: center;
   color: #000000 !important;
   font-family: "Brush Script MT", "Cursive";
   width:100%;
   height: 37px;
   overflow:hidden ;
}
div.staffbadge {  
    font-size: 18px;
    font-family: "Brush Script MT", "Cursive";
}
div.staffbadge img { padding-top:5px; }

div.staffbadge .span { padding-bottom:5px; display: block; }

div.profilefoot { padding-top:3px;
}
.article.ac-small {
margin-top:-20px;  
}
.hoverimg {
margin-top:-20px;  
}

/* UNDEFINED */
div.leifbox, div.leifbox a, div.leifbox a:link, div.leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #8c87b4; }
div.leifbox { background-color: #5f4d75; color: #8c87b4; text-align:center; }
div.profilehead, div.profilehead a, div.profilehead a:visited, div.profilefoot, div.profilefoot a, div.profilefoot a:visited, .profilefoot,  {
   color: #ccc6ed !important; }
div.mini-profile { border: 2px solid #000000 !important; }
div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Undecided.png"); }
div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Undecided.png"); }
.ppinside { background-color: #685c4b; }

/* HEARTLESS */
div.heartless .leifbox, div.heartless .leifbox a, div.heartless .leifbox a:link, div.heartless .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #A798FB; }
div.heartless .leifbox { background-color: #2c2a48; color: #A798FB; text-align:center; }
div.heartless .profilehead, div.heartless .profilehead a, div.heartless .profilehead a:visited, div.heartless .profilefoot, div.heartless .profilefoot a, div.heartless .profilefoot a:visited, .profilefoot,  {
   color: #000000 !important; }
div.heartless div.mini-profile { border: 2px solid #000000; }
div.heartless div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Heartless.png"); }
div.heartless div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Heartless.png"); }
div.heartless .ppinside { background-color: #4A3d69; }

/* SOMEBODY */
div.somebody .leifbox, div.somebody .leifbox a, div.somebody .leifbox a:link, div.somebody .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #99abda; }
div.somebody .leifbox { background-color: #2b3877; color: #99abda; text-align:center; }
div.somebody .profilehead, div.somebody .profilehead a, div.somebody .profilehead a:visited, div.somebody .profilefoot, div.somebody .profilefoot a, div.somebody .profilefoot a:visited, .profilefoot, {
   color: #99abda !important; }
div.somebody div.mini-profile { border: 2px solid #000000; }
div.somebody div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Somebody2.png"); }
div.somebody div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Somebody2.png"); }
div.somebody .ppinside { background-color: #6777b6; }

/* CONSTRUCT */
div.construct.leifbox, div.construct .leifbox a, div.construct .leifbox a:link, div.construct .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #000000; }
div.construct .leifbox { background-color: #998a68; color: #000000; text-align:center; }
div.construct .profilehead, div.construct .profilehead a, div.construct .profilehead a:visited, div.construct .profilefoot, div.construct .profilefoot a, div.construct .profilefoot a:visited, .profilefoot,  {
   color: #998a68 !important; }
div.construct div.mini-profile { border: 2px solid #000000; }
div.construct div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Machination.png"); }
div.construct div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Machination2.png"); }
div.construct .ppinside { background-color: #685c4b; }

/* NOBODY */
div.nobody .leifbox, div.nobody .leifbox a, div.nobody .leifbox a:link, div.nobody .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #d9e5f4; }
div.nobody .leifbox { background-color: #3f5277; color: #d9e5f4; text-align:center; }
div.nobody .profilehead, div.nobody .profilehead a, div.nobody .profilehead a:visited, div.nobody .profilefoot, div.nobody .profilefoot a, div.nobody .profilefoot a:visited, .profilefoot, {
   color: #000000 !important; }
div.nobody div.mini-profile { border: 2px solid #000000; }
div.nobody div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Nobody.png"); }
div.nobody div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Nobody3.png"); }
div.nobody .ppinside { background-color: #6f81b9; }


Live site CSS:

A:hover {text-decoration: none;}
A:hover, .info, .group1:hover font, .group4:hover font, .group5:hover font, .group8:hover font, .group9:hover font, .group10:hover font, .group11:hover font, .group12:hover font, .group13:hover font, .group14:hover font, .group15:hover font, A, .group1 font, .group4 font, .group5 font, .group8 font, .group9 font, .group10 font, .group11 font, .group12 font, .group13 font, .group14 font, .group15 font, a img, a:hover img {
transition: all 1.0s ease;
-moz-transition: all 1.0s ease;
-o-transition: all 1.0s ease;
-webkit-transition: all 1.0s ease;
}
A:hover, .info a:hover, .group1:hover font, .group4:hover font, .group5:hover font, .group8:hover font, .group9:hover font, .group10:hover font, .group11:hover font, .group12:hover font, .group13:hover font, .group14:hover font, .group15:hover font {
color:#b094ea;
}
a img {
filter: alpha(opacity=60);
opacity: 0.6;
border: 0;
}
a:hover img {
filter: alpha(opacity=100);
opacity: 1.0;
}

.usergroup {
   text-transform: capitalize; letter-spacing: 3px; padding-left:7px; text-align: right; font: impact;
}

.leifbox a { text-align: center; }


.leifbox a:link, a:visited {
   color: #000000;
}
.leifbox A:hover {text-decoration: none;}
.leifbox A:hover, a img, a:hover img {
transition: all 1.0s ease;
-moz-transition: all 1.0s ease;
-o-transition: all 1.0s ease;
-webkit-transition: all 1.0s ease;
}
.leifbox A:hover {
color:#FFFFFF;
}
.leifbox a img {
filter: alpha(opacity=60);
opacity: 0.6;
border: 0;
}
.leifbox a:hover img {
filter: alpha(opacity=100);
opacity: 1.0;
}

.ppinside { width:200px; height:375px; opacity:0;
   transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -webkit-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
}
.ppinside:hover { width:200px; height:375px; opacity: 1; background-color:#52374d;
   transition: all 1s ease-in-out;
   -moz-transition: all 1s ease-in-out;
   -webkit-transition: all 1s ease-in-out;
   -ms-transition: all 1s ease-in-out;
   -o-transition: all 1s ease-in-out;
}
.ppinside { width:200px; height:375px; margin:auto; text-align:center; }
.leifbox { width: 85px; height:20px; overflow:hidden; float:left; z-index:1; text-align:center; margin-left:10px;line-height:20px; margin-top:5px;}
div.leifbox { background-color: #2c2a48; color: #ffffff; text-align:center; }
.leifbox select {
  background: #212429;
  width: 75px;
  border: 0;
  border-radius: 0;
  height: 20px;
  color: #e6e8e3;
   }
.leifbox { margin-top:5px; margin-bottom:5px;
}
.ac-container{
  width: 100%;
  margin: 5px auto 5px auto;
}
.ac-container label{
  font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
  padding: 5px 5px 5px 5px;
  position: relative;
  z-index: 20;
  display: block;
   margin-left:-5px;
  height: 20px;
  cursor: pointer;
//   text-shadow: 1px 1px 1px rgba(255,255,255,0.8);
  line-height: 20px;
//   font-size: 19px;
}
//.ac-container label:hover{ background: #5F512E; }
.ac-container input{ display: none; }
.ac-container article{
  //background: rgba(37, 37, 39, 0.5);
  margin-top: -1px;
  overflow: hidden;
  height: 0px;
  position: relative;
  z-index: 10;
  -webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  -ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
  transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}
.ac-container article.article-show{
  -webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  -ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
  transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
}
.ac-container article p{
  font-style: italic;
  color: #EFEFEF;
  line-height: 23px;
  width:200px;
  height: 220px;
  font-size: 11px;
  padding: 3px;
  margin-top: -10px;

}
.ac-container article.article-show{ height: 175px; overflow:hidden; margin:auto; }

div.profilehead, .profilehead a, .profilehead a:visited .profilefoot a, .profilefoot a:visited, .profilefoot,  {
   font-size: 25px;
   vertical-align: center;
   color: #000000 !important;
   font-family: "Brush Script MT", "Cursive";
   width:100%;
   height: 37px;
   overflow:hidden ;
}
div.staffbadge {  
    font-size: 18px;
    font-family: "Brush Script MT", "Cursive";
}
div.staffbadge img { padding-top:5px; }

div.staffbadge .span { padding-bottom:5px; display: block; }

div.profilefoot { padding-top:3px;
}
.article.ac-small {
margin-top:-20px;  
}
.hoverimg {
margin-top:-20px;  
}

/* UNDEFINED */
div.leifbox, div.leifbox a, div.leifbox a:link, div.leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #8c87b4; }
div.leifbox { background-color: #5f4d75; color: #8c87b4; text-align:center; }
div.profilehead, div.profilehead a, div.profilehead a:visited, div.profilefoot, div.profilefoot a, div.profilefoot a:visited, .profilefoot,  {
   color: #ccc6ed !important; }
div.mini-profile { border: 2px solid #000000 !important; }
div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Undecided.png"); }
div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Undecided.png"); }
.ppinside { background-color: #685c4b; }

/* HEARTLESS */
div.heartless .leifbox, div.heartless .leifbox a, div.heartless .leifbox a:link, div.heartless .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #A798FB; }
div.heartless .leifbox { background-color: #2c2a48; color: #A798FB; text-align:center; }
div.heartless .profilehead, div.heartless .profilehead a, div.heartless .profilehead a:visited, div.heartless .profilefoot, div.heartless .profilefoot a, div.heartless .profilefoot a:visited, .profilefoot,  {
   color: #000000 !important; }
div.heartless div.mini-profile { border: 2px solid #000000; }
div.heartless div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Heartless.png"); }
div.heartless div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Heartless.png"); }
div.heartless .ppinside { background-color: #4A3d69; }

/* SOMEBODY */
div.somebody .leifbox, div.somebody .leifbox a, div.somebody .leifbox a:link, div.somebody .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #99abda; }
div.somebody .leifbox { background-color: #2b3877; color: #99abda; text-align:center; }
div.somebody .profilehead, div.somebody .profilehead a, div.somebody .profilehead a:visited, div.somebody .profilefoot, div.somebody .profilefoot a, div.somebody .profilefoot a:visited, .profilefoot, {
   color: #99abda !important; }
div.somebody div.mini-profile { border: 2px solid #000000; }
div.somebody div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Somebody2.png"); }
div.somebody div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Somebody2.png"); }
div.somebody .ppinside { background-color: #6777b6; }

/* CONSTRUCT */
div.construct.leifbox, div.construct .leifbox a, div.construct .leifbox a:link, div.construct .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #000000; }
div.construct .leifbox { background-color: #998a68; color: #000000; text-align:center; }
div.construct .profilehead, div.construct .profilehead a, div.construct .profilehead a:visited, div.construct .profilefoot, div.construct .profilefoot a, div.construct .profilefoot a:visited, .profilefoot,  {
   color: #998a68 !important; }
div.construct div.mini-profile { border: 2px solid #000000; }
div.construct div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Machination.png"); }
div.construct div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Machination2.png"); }
div.construct .ppinside { background-color: #685c4b; }

/* NOBODY */
div.nobody .leifbox, div.nobody .leifbox a, div.nobody .leifbox a:link, div.nobody .leifbox a:visited {
   font-size: 11px;
   text-align:center;
   vertical-align:middle;
   color: #d9e5f4; }
div.nobody .leifbox { background-color: #3f5277; color: #d9e5f4; text-align:center; }
div.nobody .profilehead, div.nobody .profilehead a, div.nobody .profilehead a:visited, div.nobody .profilefoot, div.nobody .profilefoot a, div.nobody .profilefoot a:visited, .profilefoot, {
   color: #000000 !important; }
div.nobody div.mini-profile { border: 2px solid #000000; }
div.nobody div.profilehead { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Headers/Nobody.png"); }
div.nobody div.profilefoot { background-image: url("http://i88./k175/onyx_embers/World%20Destiny/Mini-Profiles/Footers/Nobody3.png"); }
div.nobody .ppinside { background-color: #6f81b9; }


Live site Layout Template:

<!-- Mini-Profile by Nick of Fidelius -->
<!--- Leave this if/foreach section in here or the code won't run right. --->
<div class="{foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided            
{/if}
{/foreach}">

<!--- This is where the profile technically starts --->
   <div class="$[miniprofile_class]" style="width:200px;height:449px;">
<!--- CHARACTER NAME --->    
   <div class="profilehead"><div style="padding-top:1px;position:center; font-weight: bold;">$[user]
</div> </div>
<!--- HOVER IMAGE --->
   <div id="hoverimg" style="width:100%;height:375px;background-image: url('http://storage.proboards.com/5598878/i/V4FVmNuKAkTX5MxkH7M9.png');{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Hover Image"}background-image:url('$[user.mini_custom_field.value]');{/if}{/foreach}background-size:cover;text-align:center;clear:both;"><div class="pphover"><div class="ppinside">
       <div style="height:5px;clear:both;"></div>
<!--- AVATAR --->
       <div style="max-width:114px;max-height:132px;margin-left:auto;margin-right:auto;border:2px solid #000000; background-color: #000000;">$[user.avatar]</div>
<!--- ACCORDION MENU "PERSONA" --->    
<section class="ac-container">
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-5px;line-height:20px;font-size:12px;">Persona</div></label>
     <article class="ac-small article-show">

<!-- QUOTE -->
       <div align="center"><div class="leifbox" id="quote" style="height:44px;width:175px;font-size:11px;padding:3px;font-style:italic;margin-right:10px;margin-left:10px;line-height:11px;">  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Quote"}$[user.mini_custom_field.value]{/if}{/foreach}</div></div>

<!-- INVENTORY -->                
         <div class="leifbox" style="float:left;width:180px;height:90px;text-align:center;margin-left:10px;line-height:20px; overflow:auto;">
             <div class=“monetary_shop_items.pd_shop_items_1”><span class="monetary_shop_items"></span></div>
</div>
<!--- ACCORDION MENU "STATISTICS" --->
     </article>
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-15px;line-height:20px;font-size:12px;">Statistics</div></label>
     <article class="ac-medium">
         
<!-- PLAYED BY ALIAS -->
<div class="leifbox" style="width:175px;height:15px;text-align:center;font-size:11px;padding:3px;font-style:italic;">
   <span title="playd by">Played by</span>  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Alias"}{if $[user.is_online]}<span style="color:#8ccf55;" title="Online">$[user.mini_custom_field.value]</span>
{else} <span title="Offline" style="color:#cf5558;">$[user.mini_custom_field.value]</span>{/if}{/if}{/foreach}
</div>
         
<!-- PROFILE -->  
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:5px;margin-left:10px;line-height:20px;">
<span class="Profile" title="Profile">{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Profile"}<a href=$[user.mini_custom_field.value]{/if}{/foreach}> Profile </a></span>
</div>
         
<!-- SEND PM -->      
<div class="leifbox" id="messagemember" style="float:left;height:20px;text-align:center;margin-right:10px;margin-left:5px;line-height:20px;">
   {if $[current_user.is_member]}<a href="$[user.pm_href]" alt="PM $[user.name]">Send PM</a>{/if}
   </div><div style="clear:both;"></div>
           
<!-- POSTS -->      
<div class="leifbox" style="float:left;height:20px;text-align:center;margin-right:5px;margin-left:10px;line-height:20px;">
$[user.posts] posts
   </div>      
         
<!-- MUNNY -->          
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:10px;margin-left:5px;line-height:20px;">
   <span style="border 0px;"><img src="http://i88./k175/onyx_embers/World%20Destiny/WDSkinGFX/Munny.png"><span class="money_text"></span><span class="money_symbol"></span><span class="money_amount"></span>
   </span>
</div>  
                   
<!-- MP3 -->
       {foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "MP3 Link"}
   <div class="leifbox" style="float:left;width:180px;height:20px;text-align:center;margin-top:5px;margin-left:10px;line-height:20px;">
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="100%" height="100%"><param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /><param name="wmode" value="transparent"/><param name="FlashVars" value="mp3=$[user.mini_custom_field.value]"/><br></object>
</div>
   {/if}
{/foreach}
   
   
 
{if $[user.is_staff]}
 <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">        
  <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw"></div></div>        
{elseif $[user.group.id] == 4}
    <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">  
 <img src="http://tinyurl.com/hg8upk9"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">NPC</span><img src="http://tinyurl.com/hg8upk9"></div></div>
 {elseif $[user.group.id] == 2}
       <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">
     <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw">
     </div></div>
           {/if}
       
         
<!-- END MENU -->        
     </article>          
</section>
</div>
       </div>
<!--- This determines the bottom image attached to the mini profiles. --->
 <div class="profilefoot"><div style="padding-top:1px;position:center;">
{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
Somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
Nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
Heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
Construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided          
{/if}
     {/foreach}
     </div></div>  
</div>

Live site Template:

<!-- Mini-Profile by Nick of Fidelius -->
<!--- Leave this if/foreach section in here or the code won't run right. --->
<div class="{foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided            
{/if}
{/foreach}">

<!--- This is where the profile technically starts --->
   <div class="$[miniprofile_class]" style="width:200px;height:449px;">
<!--- CHARACTER NAME --->    
   <div class="profilehead"><div style="padding-top:1px;position:center; font-weight: bold;">$[user]
</div> </div>
<!--- HOVER IMAGE --->
   <div id="hoverimg" style="width:100%;height:375px;background-image: url('http://storage.proboards.com/5598878/i/V4FVmNuKAkTX5MxkH7M9.png');{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Hover Image"}background-image:url('$[user.mini_custom_field.value]');{/if}{/foreach}background-size:cover;text-align:center;clear:both;"><div class="pphover"><div class="ppinside">
       <div style="height:5px;clear:both;"></div>
<!--- AVATAR --->
       <div style="max-width:114px;max-height:132px;margin-left:auto;margin-right:auto;border:2px solid #000000; background-color: #000000;">$[user.avatar]</div>
<!--- ACCORDION MENU "PERSONA" --->    
<section class="ac-container">
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-5px;line-height:20px;font-size:12px;">Persona</div></label>
     <article class="ac-small article-show">

<!-- QUOTE -->
       <div align="center"><div class="leifbox" id="quote" style="height:44px;width:175px;font-size:11px;padding:3px;font-style:italic;margin-right:10px;margin-left:10px;line-height:11px;">  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Quote"}$[user.mini_custom_field.value]{/if}{/foreach}</div></div>

<!-- INVENTORY -->                
         <div class="leifbox" style="float:left;width:180px;height:90px;text-align:center;margin-left:10px;line-height:20px; overflow:auto;">
             <div class=“monetary_shop_items.pd_shop_items_1”><span class="monetary_shop_items"></span></div>
</div>
<!--- ACCORDION MENU "STATISTICS" --->
     </article>
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-15px;line-height:20px;font-size:12px;">Statistics</div></label>
     <article class="ac-medium">
         
<!-- PLAYED BY ALIAS -->
<div class="leifbox" style="width:175px;height:15px;text-align:center;font-size:11px;padding:3px;font-style:italic;">
   <span title="playd by">Played by</span>  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Alias"}{if $[user.is_online]}<span style="color:#8ccf55;" title="Online">$[user.mini_custom_field.value]</span>
{else} <span title="Offline" style="color:#cf5558;">$[user.mini_custom_field.value]</span>{/if}{/if}{/foreach}
</div>
         
<!-- PROFILE -->  
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:5px;margin-left:10px;line-height:20px;">
<span class="Profile" title="Profile">{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Profile"}<a href=$[user.mini_custom_field.value]{/if}{/foreach}> Profile </a></span>
</div>
         
<!-- SEND PM -->      
<div class="leifbox" id="messagemember" style="float:left;height:20px;text-align:center;margin-right:10px;margin-left:5px;line-height:20px;">
   {if $[current_user.is_member]}<a href="$[user.pm_href]" alt="PM $[user.name]">Send PM</a>{/if}
   </div><div style="clear:both;"></div>
           
<!-- POSTS -->      
<div class="leifbox" style="float:left;height:20px;text-align:center;margin-right:5px;margin-left:10px;line-height:20px;">
$[user.posts] posts
   </div>      
         
<!-- MUNNY -->          
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:10px;margin-left:5px;line-height:20px;">
   <span style="border 0px;"><img src="http://i88./k175/onyx_embers/World%20Destiny/WDSkinGFX/Munny.png"><span class="money_text"></span><span class="money_symbol"></span><span class="money_amount"></span>
   </span>
</div>  
                   
<!-- MP3 -->
       {foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "MP3 Link"}
   <div class="leifbox" style="float:left;width:180px;height:20px;text-align:center;margin-top:5px;margin-left:10px;line-height:20px;">
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="100%" height="100%"><param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /><param name="wmode" value="transparent"/><param name="FlashVars" value="mp3=$[user.mini_custom_field.value]"/><br></object>
</div>
   {/if}
{/foreach}
   
   
 
{if $[user.is_staff]}
 <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">        
  <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw"></div></div>        
{elseif $[user.group.id] == 4}
    <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">  
 <img src="http://tinyurl.com/hg8upk9"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">NPC</span><img src="http://tinyurl.com/hg8upk9"></div></div>
 {elseif $[user.group.id] == 2}
       <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">
     <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw">
     </div></div>
           {/if}
       
         
<!-- END MENU -->        
     </article>          
</section>
</div>
       </div>
<!--- This determines the bottom image attached to the mini profiles. --->
 <div class="profilefoot"><div style="padding-top:1px;position:center;">
{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
Somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
Nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
Heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
Construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided          
{/if}
     {/foreach}
     </div></div>  
</div>

Test site Layout Template:

<!-- Mini-Profile by Nick of Fidelius -->
<!--- Leave this if/foreach section in here or the code won't run right. --->
<div class="{foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided            
{/if}
{/foreach}">

<!--- This is where the profile technically starts --->
   <div class="$[miniprofile_class]" style="width:200px;height:449px;">
<!--- CHARACTER NAME --->    
   <div class="profilehead"><div style="padding-top:1px;position:center; font-weight: bold;">$[user]
</div> </div>
<!--- HOVER IMAGE --->
   <div id="hoverimg" style="width:100%;height:375px;background-image: url('http://storage.proboards.com/5598878/i/V4FVmNuKAkTX5MxkH7M9.png');{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Hover Image"}background-image:url('$[user.mini_custom_field.value]');{/if}{/foreach}background-size:cover;text-align:center;clear:both;"><div class="pphover"><div class="ppinside">
       <div style="height:5px;clear:both;"></div>
<!--- AVATAR --->
       <div style="max-width:114px;max-height:132px;margin-left:auto;margin-right:auto;border:2px solid #000000; background-color: #000000;">$[user.avatar]</div>
<!--- ACCORDION MENU "PERSONA" --->    
<section class="ac-container">
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-5px;line-height:20px;font-size:12px;">Persona</div></label>
     <article class="ac-small article-show">

<!-- QUOTE -->
       <div align="center"><div class="leifbox" id="quote" style="height:44px;width:175px;font-size:11px;padding:3px;font-style:italic;margin-right:10px;margin-left:10px;line-height:11px;">  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Quote"}$[user.mini_custom_field.value]{/if}{/foreach}</div></div>

<!-- INVENTORY -->                
         <div class="leifbox" style="float:left;width:180px;height:90px;text-align:center;margin-left:10px;line-height:20px; overflow:auto;">
             <div class=“monetary_shop_items.pd_shop_items_1”><span class="monetary_shop_items"></span></div>
</div>
<!--- ACCORDION MENU "STATISTICS" --->
     </article>
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-15px;line-height:20px;font-size:12px;">Statistics</div></label>
     <article class="ac-medium">
         
<!-- PLAYED BY ALIAS -->
<div class="leifbox" style="width:175px;height:15px;text-align:center;font-size:11px;padding:3px;font-style:italic;">
   <span title="playd by">Played by</span>  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Alias"}{if $[user.is_online]}<span style="color:#8ccf55;" title="Online">$[user.mini_custom_field.value]</span>
{else} <span title="Offline" style="color:#cf5558;">$[user.mini_custom_field.value]</span>{/if}{/if}{/foreach}
</div>
         
<!-- PROFILE -->  
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:5px;margin-left:10px;line-height:20px;">
<span class="Profile" title="Profile">{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Profile"}<a href=$[user.mini_custom_field.value]{/if}{/foreach}> Profile </a></span>
</div>
         
<!-- SEND PM -->      
<div class="leifbox" id="messagemember" style="float:left;height:20px;text-align:center;margin-right:10px;margin-left:5px;line-height:20px;">
   {if $[current_user.is_member]}<a href="$[user.pm_href]" alt="PM $[user.name]">Send PM</a>{/if}
   </div><div style="clear:both;"></div>
           
<!-- POSTS -->      
<div class="leifbox" style="float:left;height:20px;text-align:center;margin-right:5px;margin-left:10px;line-height:20px;">
$[user.posts] posts
   </div>      
         
<!-- MUNNY -->          
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:10px;margin-left:5px;line-height:20px;">
   <span style="border 0px;"><img src="http://i88./k175/onyx_embers/World%20Destiny/WDSkinGFX/Munny.png"><span class="money_text"></span><span class="money_symbol"></span><span class="money_amount"></span>
   </span>
</div>  
                   
<!-- MP3 -->
       {foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "MP3 Link"}
   <div class="leifbox" style="float:left;width:180px;height:20px;text-align:center;margin-top:5px;margin-left:10px;line-height:20px;">
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="100%" height="100%"><param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /><param name="wmode" value="transparent"/><param name="FlashVars" value="mp3=$[user.mini_custom_field.value]"/><br></object>
</div>
   {/if}
{/foreach}
   
   
 
{if $[user.is_staff]}
 <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">        
  <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw"></div></div>        
{elseif $[user.group.id] == 4}
    <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">  
 <img src="http://tinyurl.com/hg8upk9"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">NPC</span><img src="http://tinyurl.com/hg8upk9"></div></div>
 {elseif $[user.group.id] == 2}
       <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">
     <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw">
     </div></div>
           {/if}
       
         
<!-- END MENU -->        
     </article>          
</section>
</div>
       </div>
<!--- This determines the bottom image attached to the mini profiles. --->
 <div class="profilefoot"><div style="padding-top:1px;position:center;">
{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
Somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
Nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
Heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
Construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided          
{/if}
     {/foreach}
     </div></div>  
</div>

Live site Template:

<!-- Mini-Profile by Nick of Fidelius -->
<!--- Leave this if/foreach section in here or the code won't run right. --->
<div class="{foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided            
{/if}
{/foreach}">

<!--- This is where the profile technically starts --->
   <div class="$[miniprofile_class]" style="width:200px;height:449px;">
<!--- CHARACTER NAME --->    
   <div class="profilehead"><div style="padding-top:1px;position:center; font-weight: bold;">$[user]
</div> </div>
<!--- HOVER IMAGE --->
   <div id="hoverimg" style="width:100%;height:375px;background-image: url('http://storage.proboards.com/5598878/i/V4FVmNuKAkTX5MxkH7M9.png');{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Hover Image"}background-image:url('$[user.mini_custom_field.value]');{/if}{/foreach}background-size:cover;text-align:center;clear:both;"><div class="pphover"><div class="ppinside">
       <div style="height:5px;clear:both;"></div>
<!--- AVATAR --->
       <div style="max-width:114px;max-height:132px;margin-left:auto;margin-right:auto;border:2px solid #000000; background-color: #000000;">$[user.avatar]</div>
<!--- ACCORDION MENU "PERSONA" --->    
<section class="ac-container">
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-5px;line-height:20px;font-size:12px;">Persona</div></label>
     <article class="ac-small article-show">

<!-- QUOTE -->
       <div align="center"><div class="leifbox" id="quote" style="height:44px;width:175px;font-size:11px;padding:3px;font-style:italic;margin-right:10px;margin-left:10px;line-height:11px;">  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Quote"}$[user.mini_custom_field.value]{/if}{/foreach}</div></div>

<!-- INVENTORY -->                
         <div class="leifbox" style="float:left;width:180px;height:90px;text-align:center;margin-left:10px;line-height:20px; overflow:auto;">
             <div class=“monetary_shop_items.pd_shop_items_1”><span class="monetary_shop_items"></span></div>
</div>
<!--- ACCORDION MENU "STATISTICS" --->
     </article>
     <label><input name="accordion-1" type="radio" /><div class="leifbox" style="width:180px;height:20px;text-align:center;margin-left:10px;margin-top:-15px;line-height:20px;font-size:12px;">Statistics</div></label>
     <article class="ac-medium">
         
<!-- PLAYED BY ALIAS -->
<div class="leifbox" style="width:175px;height:15px;text-align:center;font-size:11px;padding:3px;font-style:italic;">
   <span title="playd by">Played by</span>  {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Alias"}{if $[user.is_online]}<span style="color:#8ccf55;" title="Online">$[user.mini_custom_field.value]</span>
{else} <span title="Offline" style="color:#cf5558;">$[user.mini_custom_field.value]</span>{/if}{/if}{/foreach}
</div>
         
<!-- PROFILE -->  
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:5px;margin-left:10px;line-height:20px;">
<span class="Profile" title="Profile">{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Profile"}<a href=$[user.mini_custom_field.value]{/if}{/foreach}> Profile </a></span>
</div>
         
<!-- SEND PM -->      
<div class="leifbox" id="messagemember" style="float:left;height:20px;text-align:center;margin-right:10px;margin-left:5px;line-height:20px;">
   {if $[current_user.is_member]}<a href="$[user.pm_href]" alt="PM $[user.name]">Send PM</a>{/if}
   </div><div style="clear:both;"></div>
           
<!-- POSTS -->      
<div class="leifbox" style="float:left;height:20px;text-align:center;margin-right:5px;margin-left:10px;line-height:20px;">
$[user.posts] posts
   </div>      
         
<!-- MUNNY -->          
<div class="leifbox" style="height:20px;text-align:center;margin-top:5px;margin-right:10px;margin-left:5px;line-height:20px;">
   <span style="border 0px;"><img src="http://i88./k175/onyx_embers/World%20Destiny/WDSkinGFX/Munny.png"><span class="money_text"></span><span class="money_symbol"></span><span class="money_amount"></span>
   </span>
</div>  
                   
<!-- MP3 -->
       {foreach $[user.mini_custom_field]}
{if $[user.mini_custom_field.name] == "MP3 Link"}
   <div class="leifbox" style="float:left;width:180px;height:20px;text-align:center;margin-top:5px;margin-left:10px;line-height:20px;">
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="100%" height="100%"><param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /><param name="wmode" value="transparent"/><param name="FlashVars" value="mp3=$[user.mini_custom_field.value]"/><br></object>
</div>
   {/if}
{/foreach}
   
   
 
{if $[user.is_staff]}
 <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">        
  <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw"></div></div>        
{elseif $[user.group.id] == 4}
    <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">  
 <img src="http://tinyurl.com/hg8upk9"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">NPC</span><img src="http://tinyurl.com/hg8upk9"></div></div>
 {elseif $[user.group.id] == 2}
       <div class="leifbox" style="width:180px;height:32px;z-index:-2;">
 <div class="staffbadge" style="position:center;height:20px;text-align:center;">
     <img src="http://tinyurl.com/jb2fzsw"><span title="Staffspan" style="padding-left:30px;padding-right:30px;">Staff</span><img src="http://tinyurl.com/jb2fzsw">
     </div></div>
           {/if}
       
         
<!-- END MENU -->        
     </article>          
</section>
</div>
       </div>
<!--- This determines the bottom image attached to the mini profiles. --->
 <div class="profilefoot"><div style="padding-top:1px;position:center;">
{foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Being type"}
{if $[user.mini_custom_field.value] == "Somebody"}
Somebody
{elseif $[user.mini_custom_field.value] == "Nobody"}
Nobody
{elseif $[user.mini_custom_field.value] == "Heartless"}
Heartless
{elseif $[user.mini_custom_field.value] == "Construct"}
Construct
{elseif $[user.mini_custom_field.value] == "None of the Above"}
Undecided
{elseif $[user.is_guest]}  
Undecided          
{/if}
     {/foreach}
     </div></div>  
</div>

I ran it through Diffchecker and it seems to check out verbatim on the sections of code in question.  I did not copy my entire CSS.  If asked I can provide copies though.

If you check the links below, hover over the image and click Statistics.  It works in the test site. It doesn't work in the live one.

Test site Mini-Profile

Live site Mini-Profile

I taught myself coding, so there's a chance I may have done something wrong.  I just can't quite figure out what.  

What I've tested seems to indicate that it has to do with how I'm telling the CSS to do what it's doing.

Any help would be very appreciated. 

Kind regards!
-Gremalkyn

[Gremalkyn]

Nevermind.

I feel like quite an idiot.

After scratching my head and toggling with more things than I should have, and rewriting coding for more hours than I should have spent rewriting coding, I found that when I integrated code over to my Live Site I forgot to edit one part in my global footers.

For anyone else who may have this trouble and may be wondering why, my answer was to go to Global Footers and add the following:

<script src="http://av.ashkir.com/mp.js"></script>

Thread resolved. ^_^

[Tumbleweed]

Apr 24, 2016 20:53:04 GMT -8 Gremalkyn said:

Nevermind.

I feel like quite an idiot.

After scratching my head and toggling with more things than I should have, and rewriting coding for more hours than I should have spent rewriting coding, I found that when I integrated code over to my Live Site I forgot to edit one part in my global footers.

For anyone else who may have this trouble and may be wondering why, my answer was to go to Global Footers and add the following:

<script src="http://av.ashkir.com/mp.js"></script>

Thread resolved. ^_^

Been there and done that (at least something very similar). Glad you worked it out because I saw your post but really didn't have time to delve into anything regarding a fix.