.levelPopup{ width:600px; max-height:350px; min-height:250px;  background:#fff; float:left; border:1px solid #ccc;position: absolute; z-index:99;}
.levelPopup .levelLeft{ float:left; width:42%; min-height:200px; background:#f4783d;}
.levelPopup .levelLeft .levelUpText{ float:left; width:100%; text-align:center; padding-top:25px}
.levelPopup .levelLeft .starLevel{margin:19px 0; background:url(../images/level-star.png) center top no-repeat; font-family:bebas, bebasregular; font-size:25px; color:#222; width:100%; height:125px; padding-top:50px; box-sizing:border-box; text-align:center; float:left}
.levelPopup .levelLeft .levelProgress{background:#f1b599; padding:10px 15px; box-sizing:border-box; width:90%; margin-left:5%; float:left; border-radius:15px;}
.levelPopup .levelLeft .levelProgress .whiteBack{ background:#fff; width:100%; float:left; height:12px;}
.levelPopup .levelLeft .levelProgress .whiteBack .workingProgress{height:12px; float:left; background:#f4783d; width:35%;}
.levelPopup .levelLeft .xpText{ padding:8px 0 10px; float:left; font-size:14px; font-family:calibri, calibriregular; color:#e7e6e6; width:100%; text-align:center}
.levelPopup .levelLeft .xpText font{font-family:bebas, bebasregular; color:#fff; font-size:14px}
.levelPopup .levelLeft .keepQuizing{float:left; width:100%; background:#db6228; padding:8px 0; text-align:center; font-family:calibri, calibriregular; font-size:15px; color:#fff;}
.levelPopup .levelRight{float:left; width:58%; background:#fff;}
.levelPopup .levelRight h3{ float:left; width:100%; text-align:center; font-size:23px; font-family:webly; color:#444; margin:0; padding:13px 0; font-weight:normal}
.levelPopup .levelRight .badgeInfoBox{width:74%; margin:8px 13% 25px; float:left; padding:24px 0; box-sizing:border-box; background:#143066;}
.levelPopup .levelRight .badgeInfoBox .sidePart{ width:49.5%; height:146px; float:left; border-right:1px solid #fff;}
.levelPopup .levelRight .badgeInfoBox .sidePart h4{ font-family:webly; font-size:19px; color:#fff; text-align:center; float:left; width:100%; margin:0; padding:0; font-weight:normal; text-transform:uppercase}
.levelPopup .levelRight .badgeInfoBox .sidePart p{ font-family:calibri, calibriregular; font-size:16px; color:#f0f0f0; padding:15px 10px 0; text-align:center; width:100%; float:left; margin:0; box-sizing:border-box}
.levelPopup .levelRight .badgeInfoBox .sidePart:nth-child(2){ border-right:0}
.levelPopup .levelRight .badgeInfoBox .sidePart .badgeImage{ float:left; width:100%; padding:14px 0 4px; text-align:center}
.levelPopup .levelRight .badgeInfoBox .sidePart .badgeImage img{ height:82px}
.levelPopup .levelRight .badgeInfoBox .sidePart .badgeName{ float:left; text-align:center; width:100%; font-family:calibri, calibriregular; font-size:13px; color:#f0f0f0;}
.levelPopup .levelRight .unloackText{ text-align:center; font-family:calibri, calibriregular; font-weight:bold; font-size:15px; color:#143066; float:left; width:100%; text-align:center;}