♡ JUNGJNSOUL'S POPUP PT 2

/*		POP-UP STYLING!		*/

.popup_block{
    display:none;
    background:#e3e3e3;  	/* CHANGE BACKGROUND COLOR!!! */
    padding:20px 20px 0px 20px;
    border-radius:5px;
    float:left;
    position:fixed;
    top:50%;left:50%;
    z-index: 99999;
    -webkit-box-shadow: 0px 0px 20px #000
    -moz-box-shadow: 0px 0px 20px #000;
    box-shadow: 0px 0px 20px #000;
    width:300px; height:auto;
}

.box1top {
    width:330px; height:10px;
    padding:5px; background-color:#222; 	/* CHANGE TOPPER COLOR */
    position:absolute;
    top:-10px; bottom:0px; left:0px; right:0px;
    border-radius:5px 5px 0px 0px;
}

*html #fade {position: absolute;}
*html .popup_block {position: absolute;}
#fade {
    display:none;
    position:fixed;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    z-index:9999;
    background:#000;
    opacity:0.5;
}


        /* --- hi! this is the actual admin
               information blurbs, be really
               careful when if u edit bc they're
               a bit fickle.

        QUICK CHEAT SHEET:
            ADMINB - LEFT ADMIN BOX
            ADMINQ - LEFT ADMIN TEXT BOX
            ADMINC - LEFT ADMIN IMAGE
            ADMIND - RIGHT ADMIN BOX
            ADMINR - RIGHT ADMIN TEXT BOX
            ADMINE - RIGHT ADMIN IMAGE --- */

#adminb {
   width:300px;
   height:100px;  /* i restricted the height of each section just so it would match up with the icons, it will scroll automatically if your text is longer - but you don’t have to include this bit if you don’t want to */
   background-color: transparent;
   padding-bottom:5px;
   margin-bottom:10px;
   margin-left:10px;
   margin-top:10px;
   overflow:none; }

   .adminq {

       font-size:10px;
       padding:0px 0px 0px 15px;
       width:190px; height:80px;
       overflow:auto;
   }

   .adminq h1 {
       font-size:11px;
       text-transform:uppercase;
   }

#adminc img {
   float:left;  /* you can change this to right if you prefer your image on the other side */
   margin-left:4px;
   margin-top:4px;
   border:5px solid #000; /* icon border color */
   border-radius:100%;
   width:55px;
   height:55px;
   padding:5px;
   -webkit-transition:all 0.3s ease-out;
   -moz-transition:all 0.3s ease-out;
   transition:all 0.3s ease-out; }

/* the section below is completely optional, but it’s just an additional style option for an effect when you hover over an image */

#adminc:hover img {
   border:5px solid #eee; /* icon border hover color */
   -webkit-transition:all 0.5s ease-out;
   -moz-transition:all 0.5s ease-out;
   transition:all 0.5s ease-out; }

   #admind {
   width:300px;
   height:100px;  /* i restricted the height of each section just so it would match up with the icons, it will scroll automatically if your text is longer - but you don’t have to include this bit if you don’t want to */
   background-color: transparent;
   padding-bottom:5px;
   margin-bottom:10px;
   margin-left:10px;
   margin-top:-8px;
   overflow:none; }

   .adminr {

       font-size:10px;
       padding:0px 0px 15px 0px;
       width:190px; height:80px;
       overflow:auto;
   }

   .adminr h1 {
       font-size:11px;
       text-transform:uppercase;
   }

#admine img {
   float:right;  /* you can change this to right if you prefer your image on the other side */
   margin-right:16px;
   margin-top:4px;
   border:5px solid #000; /* icon border color */
   border-radius:100%;
   width:55px;
   height:55px;
   padding:5px;
   -webkit-transition:all 0.3s ease-out;
   -moz-transition:all 0.3s ease-out;
   transition:all 0.3s ease-out; }

/* the section below is completely optional, but it’s just an additional style option for an effect when you hover over an image */

#admine:hover img {
   border:5px solid #eee; /* icon border hover color */
   -webkit-transition:all 0.5s ease-out;
   -moz-transition:all 0.5s ease-out;
   transition:all 0.5s ease-out; }

    .notificationtext {
        color:#222; 	/* TOPPER TITLE TEXT */
		font-size:9px;
        text-align:center;
        margin-top:-11px;
        text-transform:uppercase;
        letter-spacing:1px;
        font-weight:bold;
    }

    .notificationdot {
        border-radius:100%;
        height:7px; width:7px;
        background-color:#ae4b33; 	/* CHANGE DOT COLOR */
        margin-top:2px; margin-left:2px;
    }