body {
	font-size: 100%;
	font: inherit;
        font-family:       arial;
        cursor:               url("/images/icons/zombie.cur"), default;
        background: url("/images/main/back-pocket.jpg") center #1b2733;
        margin:               0 0 0 0;
        padding:              0 0 0 0;
}

body h1 {
font-size: 20px;
}

@font-face {
    font-family: 'october crow';
    src: url('october_crow-webfont.woff2') format('woff2'),
         url('october_crow-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Spider Talent';
    src: url('spider-talent.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.tooltip
{
    text-align: center;
    color: #fff;
    background-color: #440e6a;
    background:       rgba(68,17,91,0.8);
    position: absolute;
    z-index: 100;
    padding: 15px;
    border-radius: 15px;
    border: black solid 2px;
    pointer-events:   none;
}

.tooltip h4 {
margin:           3px;
text-align:       center;
}

.tooltip p {
margin:           5px;
padding:          10px;
border-radius:    15px;
background:       #190426;
word-wrap:        break-word;
}

.tooltip table {
width:            130px;
margin:           0 auto 0 auto;
}

.tooltip .dp_area {
position:              absolute;
margin:                -50px 0 0 -70px;
border:                black solid 2px;
box-shadow:           -5px 5px 20px #3d3791;
}
 
    .tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }
 
        .tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #111;
            top: -20px;
            bottom: auto;
        }
 
        .tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        .tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }

#pn_docs {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;
margin: 15px 0 15px 0;
padding: 14px;
}

#pn_docs h2, #pn_docs h4 {
text-align: center;
background-color:   #282535;
border:             black dotted 2px;
margin: 10px auto 10px auto;
}

#pn_docs h2 {
width: 60%;
}

#pn_docs h4 {
width: 80%;
}

#pn_docs ol li {
margin: 10px 0 10px 0;
}

#adult_only_barrier {
position: fixed;
z-index: 999;
width: 100%;
height: 100%;
margin: -10px 0 0 0;
color: white;
background: url(/images/gradients/pn-bg.png) #121c38;
}

#adult_only_barrier div {
border: black solid 4px;
border-radius: 15px;
width: 750px;
margin: 25px auto 0 auto;
border: black solid 4px;
overflow: auto;
padding: 15px;
background-color: #121b38;
}

#adult_only_barrier div .sexy_suc {
width: 400px;
float: left;
}

#adult_only_barrier div #succubus_2 {
display: none;
}

#adult_only_barrier div #pn_adult_logo {
width: 300px;
float: left;
margin-left: 25px;
} 

#adult_only_barrier div #js_warning {
width: 94%;
color: red;
margin: 1%;
clear: both;
}

#adult_only_barrier div h2 {
float: left;
margin-left: 100px;
}

#adult_only_barrier div div {
width: 300px;
border: black solid 4px;
float: left;
background-color: #091525;
margin: 10px 0 0 10px;
}


.battle_notice {
text-align:            center;
margin:                3px;
box-shadow:            5px 5px 10px black;
border-radius:         15px;
border:                2px solid black;
background:            #22212a;
font-size:             14px;
}

.promotion {
background-color:     #384878;
width:                390px;
min-height:           240px;
float:                left;
box-shadow:           5px -5px 0px #9ca8cb;
margin:               10px;
}

.promotion .main_ad {
float: left;
border:            none;
box-shadow:        5px -5px 0px #323264;
margin:            10px 10px 5px 8px;
}

.promotion p {
padding:            5px;
}

.promotion b {
color:              red;
}

.promotion input {
margin:             -10px 5px 5px 5px;
width:              180px;
}

.journal {
width:                800px;
margin:               10px auto 10px auto;
padding:              13px 0 13px 0;
box-shadow:           5px 5px 10px black;
border-radius:        15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.journal h4 {
padding:             5px 0 5px 5px;
margin:              5px;
background-color:   #282535;
border:             black dotted 2px;
}

.journal ul {
list-style:         none;
}

.journal ul li {
width:       720px;
margin:      0px 10px 0px 5px;
padding:     3px 30px 3px 30px;
list-style: none;
background: url(../images/icons/pending.png) no-repeat center left; 
}

.journal ul li i {
color:      red;
}

.journal ul li li {
list-style-image: url(../images/icons/canceled.png);
}

#margin_box {
width:                100%;
min-width:            900px;
min-height:           300px;
background-repeat:    no-repeat;
background-position:  center;  
margin:               0px auto 0 auto;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
opacity: 1;
}

#margin_box #adult_check {

width:                      865px;
margin:                     0px auto 0 auto;
padding: 5px 5px 5px 5px;
color: white;
text-align: center;
}

#margin_box #adult_check b {
color: red;
}

#margin_box #loading_icon {
z-index: 100;
position: absolute;
left: 550px;
top: 400px;;
}

#border_box {
width:                      875px;
min-height:                 103px;
margin:                     0px auto 0 auto;
padding:                    0;
border-bottom:              none;
background-color: transparent;
border-radius: 5px;
}

#border_box::after {
content: "";
display: table;
clear: both;
}

#stretch_display_box {    
width:              826px;
min-height:         100px;
padding:            3px 0 12px 0;
margin:             0px auto 0px auto;
color:              white;
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
border:            2px dotted black;
border-top:        none;
background-image: url("/images/main/puppet-silhouette.png");
background-color: #402f44;
background-size: 50%;
}

#stretch_display_box .general_navigation_box {
width: 100%;
min-height: 50px;
clear: both;
}

#stretch_display_box .general_navigation_box .next_button,
#stretch_display_box .general_navigation_box .prev_button {
width: 125px;
height: 50px;
line-height: 50px;
background-color:      #5e5d70;
border:               black dotted 2px;
border-radius: 10px;
margin: 5px;
font-size: 33px;
text-align: center;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
}

#stretch_display_box .general_navigation_box .next_button:hover,
#stretch_display_box .general_navigation_box .prev_button:hover {
background-color:      #353749;
}

#stretch_display_box .general_navigation_box a {
text-decoration: none;
}

#stretch_display_box .general_navigation_box .next_button {
float: right;
margin-right: 25px;
}

#stretch_display_box .general_navigation_box .prev_button {
float: left;
margin-left: 25px;
}

#stretch_display_box h1 {
font-size: 20px;
}

#stretch_display_box #intro_image {
border-radius: 5px;
box-shadow:       6px 6px 10px black;
margin: 0 auto 0 auto;
display: block;
border: black solid 4px;
}

#stretch_display_box h2 {
text-align: center;
color: white;
}

/* main page */

#padding_box {
width:            875px;
min-height:       520px;
margin:           -2px 0 0px -2px;
border-bottom:    none;
padding-bottom:   5px;
}

.warning_header {
color:            white;
text-align:       center;
line-height:      30px;
margin:           0px auto 0px auto;
display:          block;
clear:            both;
width: 90%;
clear: both;
}

.warning_header ul {
text-align: left;
background-repeat: no-repeat;
padding-left: 100px;
}

.warning_header ul li {
margin-bottom: 2vh;
}


.warning_header i {
color: red;
}

#padding_box table {
margin:                0 auto 0 auto;
text-align:            center;
color:                 white;
}

#padding_box div {
float:                 left;
}

#cookie_notice {
position:      fixed;
left:         0;
bottom:        0;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
color: white;
width: 100%;
}

#cookie_notice p, #cookie_notice h5 {
background-color:   #282535;
border:             black dotted 2px;
color: white;
text-align: center;
width: 75%;
margin: 15px auto 15px auto;
}

#cookie_notice h5 {
width: 60%;
color: yellow;;
}

#cookie_notice p b {
color: yellow;
}

#padding_box #front_box, #padding_box #outside_information {
background-image: url("/images/main/puppet-silhouette.png");
background-color: #402f44;
background-size: 30%;
 overflow:        auto;
border:           none;
width:            820px;
margin:           0 0 0 14px;
padding-left:     20px;
padding-right:    10px;
border:          black dotted 4px;
color: white;
}

#padding_box #front_box h1, 
#padding_box #outside_information h1 {
font-size: 25px;
}

#padding_box #front_box #features {
border-top-right-radius:    15px;
border-top-left-radius:     15px;
color:            white;
margin:           0 auto 0 auto;
padding:          0 10px 0 10px;
margin: 10px 5px 5px 5px;
padding-top: 20px;
background-color: #5e6180;
border: black dotted 2px;
background: rgba(94,97,128,0.50);
}

#padding_box #features .panel {
margin: 0 auto 0 auto;
display: block;
border: black dotted 4px;
background-color: #282536;
}

#padding_box #front_box  #features h1 {
background: transparent;
border: none;
font-size: 20px;
}

#padding_box #front_box #features p {
font-weight:                normal;
text-align:                 left;
padding:                    12px;
background-color:   #282535;
border:             black dotted 2px;
}

#padding_box #front_box #features div #join_img {
float: left;
width: 200px;
}

#padding_box #front_box #features h3 { 
margin:                8px 20px 15px 20px;
border-radius:         15px;
padding:               2px 0 2px 0;
text-align:            center;
color:                 white;
border:                2px dotted black;
background-color:      #282536;
}

#padding_box #front_box #features div h2 {
float: left;
padding-left: 180px;
}

#padding_box #front_box #features div p {
display: block;
float:   left;
width:   550px;
}

#padding_box #front_box #features div a {
font-size: 25px;
margin: 10px;
display: block;
clear: both;
border: black solid 2px;
width: 120px;
text-align: center;
background-color: #282536;
border-radius: 10px;
padding: 10px;
}

#padding_box #front_box #affiliates {
color:            white;
margin:           0 auto 0 auto;
padding:          0 10px 0 10px;
margin: 10px 5px 5px 5px;
border: black dotted 2px;
background:      #5e6180;
background: rgba(94,97,128,0.50);
}

#padding_box #front_box #affiliates h3 {
margin:                8px 20px 15px 20px;
border-radius:         15px;
padding:               2px 0 2px 0;
text-align:            center;
color:                 white;
border:                2px dotted black;
background-color:      #282536;
}

#padding_box #front_box #affiliates p {
background-color:   #282535;
border:             black dotted 2px;
padding: 10px;
}

#padding_box #front_box #affiliates div {
width: 370px;
margin: 0 0px 0 10px;
padding-bottom: 10px;
height: 200px;
}

#padding_box #front_box #affiliates div p {
height: 50px;
overflow: auto;
}

#padding_box #front_box #affiliates div img {
width: 96%;
border: black solid 2px;
}

#padding_box #front_box #front_page_container {
position: relative;
margin: 0 auto 0 60px;
}

#padding_box #front_box #front_logo {
margin:           0 auto 0 auto;
display:          block;
}

#padding_box #front_box #google_plus_box {
margin:           -50px 0 0 220px;
position:         absolute;
}

#padding_box #front_box #likebox {
border:           none;
background-color: transparent;
display:          block;
overflow:         hidden;
width:            240px;
height:           90px;
margin:           -60px auto 0 320px;
padding:          0 0 0 0;
position:         absolute;
}

#padding_box #front_box #join_button {
width:            150px;
height:           45px;
font-size:        30px;
margin:           334px 0 0 266px;
position:         absolute;
transition:      opacity 0.3s ease;
}

#padding_box #front_box #join_button a {
color:            white;
display:          block;
text-align:       center;
line-height:      45px;
text-decoration:  none;
border: black solid 4px;
background-color: #303d62;
box-shadow:       -4px 6px 0px black;
transition:      all 0.3s ease;
border-radius: 10px;
}

#padding_box #front_box #join_button a:hover {
color:            white;
opacity: .50;
}

#padding_box #front_box #join_button a:visited {
color:            white;
}

#padding_box #front_box #social_media_box {
width:            97%;
margin:           5px auto 5px auto;
padding: 3px;
float: none;
clear: both;
background-color: #5e6180;
border: black dotted 2px;
background: rgba(94,97,128,0.50);
}

#padding_box #front_box #social_media_box h4 {
font-size: 16px;
margin:0;
padding:0;
}

#padding_box #front_box #social_media_box img {
padding: 1px;
border: black dotted 4px;
background-color: #645a72;
height: 43px;
margin-top: 3px;
background-image: url(/images/main/pn-button.jpg);
}

#padding_box #front_box #social_media_box img:hover {
background-image: url(/images/main/pn-button-light.jpg);
background-color:   #5e5d70;
background-repeat: no-repeat;
background-size: cover;
}

#padding_box #front_box #feature_box {
width:            97%;
margin:           10px auto 10px auto;
padding:          3px;
border: black dotted 2px;
background-color: #5e6180;
text-align:       center;
padding:          5px;
float: none;
clear: both;
background: rgba(94,97,128,0.50);
}

#padding_box #front_box #feature_box img {
border:           black solid 3px;
box-shadow:       -2px 6px 0px black;
border-radius: 15px;
margin: 5px;
background-color: #1d2538;
}

#padding_box #front_box #feature_box table {
margin-bottom:    5px;
}

#padding_box #front_box #feature_box table  td {
background-color:   #282535;
border:             black dotted 2px;
border-radius: 5px;
}

#padding_box #front_box #feature_box h4 {
background-color:   #282535;
border:             black dotted 2px;
width: 30%;
margin: 0 auto 0 auto;
}

#padding_box #front_box #feature_box h4:hover {
opacity: .75;
}

#padding_box #front_box #feature_box table  p {
margin: 0;
font-size: 20px;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
padding: 5px;
}

#padding_box #front_box #log_in_container, #padding_box #front_box #outside_information {
margin:            20px auto 0 50px;
width:             780px;
height:            500px;
border-radius:     25px;
color:             white;
}

#padding_box #front_box #log_in_container #log_info {
width:             200px;
padding:           25px;
float:              left;
color: white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:             black dotted 4px;
}

#padding_box #front_box #log_in_container #log_info p {
background-color: #282535;
border:             black dotted 4px;
}

#padding_box #front_box #log_in_container #log_info p b {
color: red;
}

#padding_box #front_box #log_in_container #log_info ul {
list-style:         none;
margin:            0px auto 0 0px;
padding:           0 0 0 10px;
}

#padding_box #front_box #log_in_container #log_info ul li h6 {
padding:           0 0 0 0;
margin:            3px 0 3px 0;
}

#padding_box #front_box #log_in_container h4 {
margin-top:        0px;
text-align:        center;
color:             white;
padding:           5px 0 5px 0;
background-color: #293e60;
border-bottom: black solid  2px;
border-radius:    15px;
}

#interface_menu {
margin: 10px 0 0 14px;
}

#interface_menu .interface_buttons {
height: 100px;
width: 200px;
display: block;
float: left;
color: white;
line-height: 100px;
text-align: center;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
font-size: 30px;
border-top-right-radius:    15px;
border-top-left-radius:     15px;
border-right: black solid 4px;
border-left: black solid 4px;
border-top: black solid 4px;
background-repeat: no-repeat;
}

#interface_menu #big_logo {
background-image: url("/images/main/medium-logo.png");
border-color: #040813;
}

#interface_menu #mobile_button {
background-image: url("/images/icons/buttons/mobile/mobile-button.jpg");
}

#interface_menu  #mobile_button:hover {
background-image: url("/images/icons/buttons/mobile/mobile-button-animated.gif");
}

#interface_menu #desktop_button {
background-image: url("/images/icons/buttons/mobile/desktop-button.jpg");
}

#interface_menu  #desktop_button:hover {
background-image: url("/images/icons/buttons/mobile/desktop-button-animated.gif");
}

#guest_wrapper {
}

#content_notice {
color: white;
background: #3b4f68;
text-align: center;
width: 800px;
margin: 0 auto 5px auto;
border-radius: 10px;
padding: 5px;
}

#content_notice p {
margin: 0;
}

#main_menu {
overflow: none;
font-size:      21px;
overflow:       none;
height:         64px;
width: 100%;
border-bottom: none;
padding-left:   34px;
}

#main_menu.guest_wrapper {
padding-left:   30px;
}

#main_menu ul {
padding:         0;
margin: 0 auto 0 auto;
text-align:      center;
list-style:      none;
height:          64px;
}

#main_menu ul li {
float:            left;
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
padding:          0 15px 0 10px;
background-image: url(/images/main/pn-big-button.jpg);
margin-left: 5px;
width: 100px;
}

#main_menu ul li:hover {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
background-image: url(/images/main/pn-button-light.jpg);
}


#main_menu ul li a {
height:          40px;
line-height:     28px;
display:         block;
text-decoration: none;
font-weight:     normal;
background-repeat:     no-repeat;
background-position:   left; 
color:           white;
transition:      all 0.3s ease;
text-shadow:     -2px 2px black;
margin:           5px 0 5px 0;
padding:          10px 0 0 30px;
}

.browser_block {
margin:          0 0 0 0px;
float:           left;
}

#outside_information {
min-height: 500px;
}

#outside_information h4 {
margin-top:        0px;
text-align:        center;
color:             white;
padding:           5px 0 5px 0;
margin-top: 30px;
background-color:   #282535;
border:             black dotted 2px;
}

#outside_information table {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
padding: 15px;
}

#outside_information #recapcha_div {
clear: both;
margin: 20px auto 20px 250px;
display: block;
}

#outside_information #pass_reset {
clear: both;
margin: 50px auto 0 auto;
display: block;
}


#padding_box #front_box #log_in_container p {
padding:           10px;
}

#padding_box #front_box #log_in_container #news {
width:             460px;
height:            400px;
overflow:          auto;
float:             left;
padding:           5px;
margin:            0px auto 25px 25px;
color:             white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:             black dotted 2px;
}

#padding_box #front_box #log_in_container #news h3 {
text-align: center;
}

#padding_box #front_box #log_in_container #news h4 {
background-color:   #282535;
}

#padding_box #front_box #log_in_container #news h5 {
font-size: 14px;
padding-left: 10px;
}

#log_in_container #news ul {
list-style: none;
padding: 0 0 0 5px;
}

#front_box #game_warning {
border: black solid 2px;
border-radius: 15px;
color:      black;
background: white;
background: rgba(255,255,255,0.95);
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: 100px 0 0 200px;
width: 660px;
height: 300px;
}

#front_box #game_warning p {
margin:     5px 0 5px 0;
padding: 25px;
font-size: 20px;
}

#front_box #game_warning h5 {
background-color: black;
border-top-right-radius:    10px;
border-top-left-radius:     10px;
color:       red;
text-align: center;
margin:      0 0 0 0;
padding:     5px 0 5px 0;
line-height: 50px;
font-size: 25px;
}

#front_box #game_warning {
clear: both;
}

#front_box #game_warning b {
color: red;
}

#front_box #game_warning a {
color: blue;
}

#front_box #game_warning a:hover {
color: purple;
}
 
#padding_box #front_box #broken {
margin:            25px auto 25px auto;
box-shadow:        3px 3px 10px black;
display:           block;
border-radius:     15px;
}

#register {
width:             855px;
overflow:          auto;
position:          absolute;
margin:            6px 0px 0 2px;
padding:           2px 10px 25px 10px;
float:             left;
background-color:  black;
background:        rgba(0,0,0,0.8);
z-index:           20;
border-radius:     15px;
}

#register #age_notice {
border: black dotted 2px; 
background-color: #9764ac;
margin: 10px;
padding: 4px;
}

#register h2 {
padding:           3px;
color:             white;
text-align:        left;
font-size:         20px;
border-radius:     15px;
text-align:        center;
}

#register #reg_img {
float: left;
margin:            5% 2.5% 0 2.5%;
width: 35%;
}

#register #needed_reg_info {
position:    absolute;
color:       white;
margin-top:  55%;
width: 35%;
}

#register #needed_reg_info ul {
margin:            5% 2.5% 0 2.5%;
}


#register #reg_input_panel {
width:             470px;
padding:           10px 0 45px 10px;
margin:            0 auto 0 auto;
color:             white;
float:             left;
display:           block;
box-shadow:        -5px 5px 35px #1c2183;
background-color: black;
border-radius:     20px;
}

#register #reg_input_panel table {
border-spacing:10px;
}

#register #reg_input_panel table td {
text-align:        left;
}

#register #reg_input_panel #name_availability, #register #reg_input_panel #email_availability  {
text-align: center;
}

#register #reg_input_panel table th {
text-align:        center;
}

#register input {
background-image: none;
}

#register .black_box {
margin:            15px 25px 0 15px;
}

#register .reg_agree {
text-align:        left;
padding:           5px 0 0 15px;
}

#register table table {
box-shadow:        none;
margin:            15px;
}

#register table th {
font-family:       arial, serif;
}

#register table a {
font-weight: normal;
}

#register table td {
font-size: 14px;
}

#register #reg_input_panel #bigger_input .pn_box {
font-size: 20px;
}

h1 {
color: white;
text-align: center;
}

a:link {
color: #d4eefc;
transition:            color 1s ease;
}

a:visited {
color: #b7d7e9;
}

a:hover {
color: white;
transition:            color 1s ease;
}

a:active {
color: #d4eefc;
}

.contact_box {
width:            370px;
min-height: 250px;
color:            white;
margin:           0 0px 5px 15px;
border:       black dotted 2px;
padding:          5px 10px 5px 10px;
border-radius:    15px;
float:            left;

background-color:      #353749;
background: rgba(53,55,73,0.90);
}

.contact_box h4 {
margin:           0 0 0 0;
height:           50px;
padding:          0px 0 0 0;
line-height:      50px;
font-size:        14px;
text-align:       center;
}

.contact_box img {
text-align:       center;
float:            left;
width:            50px;
height:           50px;
}

.contact_box a {
text-align: center;
margin: 0 auto 0 auto;
padding: 0;
width: auto;
display: block;
}

.contact_box p {
height:             120px;
margin:             5px auto 5px auto;
background-color:   #282535;
border:             black dotted 2px;
color:              white;
padding:            5px 10px 5px 10px;
border-radius:      15px;
overflow:           auto;
}

.contact_box h6 {
text-align: center; 
font-size: 14px;
margin: 4px 0 4px 0;
padding: 0;
}

.contact_box span {
text-align: center; 
width: 100%;
display: block;
}

.hidden_form {
margin:        0;
display:       inline;
}

.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sf-menu li {
	position: relative;
}
.sf-menu ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	z-index: 99;
}
.sf-menu > li {
	float: left;
}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
	display: block;
}

.sf-menu a {
	display: block;
	position: relative;
}
.sf-menu ul ul {
	top: 0;
	left: 100%;
}


.sf-menu {
margin:             5px 0 0px 23px;
display:            block;
}

#lower_half {
clear: both;
}

.sf-menu, .sf-menu ul {
padding:            0;
z-index:            21;
list-style:         none;
}

.sf-menu ul {
margin:             5px 0 0px 0px;
}

.sf-menu a {
display:            block;
width:              118px;
line-height:        25px;
margin:             0 0 0 0;
border:             black solid 2px;
text-align:         center;
padding:            3px 0 3px 0;
background-repeat:  no-repeat;
text-decoration: none;
transition:    all 1s ease;
-webkit-transition: all 1s ease;
color: white;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000;  
}

.sf-menu li {
background-image: url("/images/main/pn-button.jpg");
background-color: #414358;
}

.sf-menu li:hover {
background-image: url("/images/main/pn-button-light.jpg");
background-color:   #5e5d70;
}

.sf-menu a li {
}

.sf-menu a:hover {
background-repeat:  no-repeat;
}

.sf-menu li {
float:               left;
width:              118px;
}

.sf-menu li ul li a img {
border:             none;
margin:       0;
}

.sf-menu li ul {
position:           absolute;
width:              113px;
display:            none;
border-top:         none;
background-color:   #181b54;
font-size:          12px;
margin-top: -1px;
}

.sf-menu li ul a {
text-decoration: none;
padding-left:    3px;
width:           113px;
margin:          0 0 0 0;
border-top-right-radius:    0px;
border-top-left-radius:    0px;
}

.sf-menu li ul a img {
float:              left;
margin:             0 0 0 -2px;
}

.sf-menu li ul a:hover {
color:              white;
}

.sf-menu img { 
border:          none; 
margin:          0 0 0 0;
}

.sf-menu li:hover ul, .sf-menu li.sfhover ul {
left:            auto;
}

.sf-menu li ul ul {
	margin: 0 0 0 117px;
        border-top: black solid 1px;
}

.sf-menu, .sf-menu ul {
	padding: 0;
	list-style: none; 
	line-height: 1;
}

.sf-menu li:hover ul ul, .sf-menu li.sfhover ul ul {
display: none;
}

.sf-menu li:hover ul, .sf-menu li li:hover ul, .sf-menu li.sfhover ul, .sf-menu li li.sfhover ul {
	left: auto;
}


#footer {
height:            50px;
margin:            0 auto 0 auto;
width:             875px;
}

/* main page end */

#map_box {    
width:            826px;
min-height:       75px;
margin:           -2px auto 0px auto;
padding:          10px 0 10px 0;
color:            white;
border:           2px solid black;
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
background-image: url("/images/main/puppet-silhouette.png");
background-color: #402f44;
background-size: 50%;
}

#map_box h3, #map_box h4 {
margin:           0 auto 0 auto;
padding:          0 0 1px 0;
text-align:       center;
border:           2px dotted black;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
}

#map_box h3 {
border-top-right-radius:    15px;
border-top-left-radius:     15px;
background:      #5e6180;
background: rgba(94,97,128,0.50);
}

#map_box h4 {
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
border: none;
}

#map_box h3 b {
color:            lime;
}

#map_box table {
margin:           0 auto 0 auto;
border:           2px solid black;
}

#map_box table img{ 
display:          block;
margin:           0;
}

#map_box table a img {
border:           none;
}

#game-rankings {
width:            100%;
margin:           10px auto 10px auto;
border-radius:    10px;
padding:          20px;
}


#game-rankings h3 {
text-align:       center;
margin:           -20px auto 10px auto;
}

#game-rankings h5 {
text-align:       center;
}

#game-rankings p {
text-align: center;
}

#game-rankings p i {
color: red;
}

#game-rankings ul {
list-style:        none;
margin:            0 auto 0 auto;
padding:          20px;
border-radius:    15px;
width:            80%;
overflow: auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#game-rankings ul a {
background-repeat: no-repeat;
line-height:       50px;
border-radius:    15px;
margin:            1.0%;
float:            left;
line-height:      50px;
width: 46%;
display: inline;
text-align: center;
background-color:   #282535;
border:             black dotted 2px;
}

#game-rankings ul a img {
max-height: 30px;
border:           2px dotted black;
border-radius:    10px;
float: left;
margin: 1%;
background-color:   #22212a;
}

#game-rankings table {
margin:           0 auto 0 auto;
text-align:       center;
width:            80%;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#game-rankings table td {
background:       #111c39;
padding:          5px;
border:           none;
}

#game-rankings table th {
padding:          5px;
background-color:   #282535;
border:             black dotted 2px;
}

#game-rankings table td {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
}

#display_box {    
width:            825px;
min-height:       750px;
margin:           0px auto 0px auto;
padding:          0 0 0 0;
background:       #333333;
border:           2px solid black;
}

#url_notice h6 {
text-align: center;
padding: 0 0 0 0;
background-color:   #282535;
border:             black dotted 2px;
padding: 10px 6px 10px 6px;
margin: 6px 6px 0 6px;
}

#url_notice a {
background-color: black;
text-align: center;
border-radius: 5px;
padding: 6px;
}

#user_notice {
width:            824px;
margin:           2px auto 2px auto;
background:      #0d1d3f url(../images/gradients/08.png);
border:           black solid 2px;
border-top:       0;
border-bottom-right-radius:  15px;
border-bottom-left-radius:   15px;
box-shadow:                  5px 5px 10px black;
}

#user_notice a {
text-decoration:  none;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

#user_notice table {
margin:           0 auto 0 auto;
color:            white;
text-align:       center;
}

#user_notice table b {
color:            lime;
}

#user_notice table img {
border:           none;
}

#user_notice table td {
min-width:        250px;
}

.server_data {
color:            white;
width:            100%;
text-align:       center;
line-height:      30px;
margin:           0px auto 0px auto;
display:          block;
clear:            both;
}

#user_bottom_information {
color:            white;
width:            100%;
text-align:       center;
line-height:      30px;
display:          block;
clear:            both;
width:            830px;
border-radius:    25px;
margin:           26px auto 0px auto;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;
}

#user_bottom_information p {
padding: 0;
margin: 0;
}

#user_bottom_info_update b {
color: lime;
}


.server_data b {
color:            lime;
}

#alert {
color:            white;
width:            824px;
line-height:      30px;
margin:           0px auto 0px 23px;
padding:          5px;
border:           2px solid black;
box-shadow:       5px 5px 10px black;
background:       black;
border-radius:    15px;
position:         absolute;
background:       rgba(0,0,0,0.7);
z-index:          20;
}

#alert img {
float:            right;
margin:           10px 10px;
padding:          5px;
width: 50px;
}

#alert .unlock_reward {
float:            none;
}

/* end main layout */

/* begin search screen layout */

#search_options {
text-align:         center;
padding:            5px;
margin-top:         5px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
border-bottom:      none;
font-size:          16px;
width: 950px;
margin-left: -50px;
}

#search_options.book_clear {
clear: both;
background: none;
border: none;
margin: 20px 0 10px 0;
}

#search_waiting {
text-align:         center;
padding:            5px;
margin-bottom:         5px;
background-color:   #282535;
border:             black dotted 2px;
border-top:         none;
font-size:          16px;
color:              white;
width: 950px;
margin-left: -50px;
}

#search_options table {
margin:             0 auto 0 auto;
}

#search_options table th {
color:              white;
}

/* begin player status screen layout */

#unlock_box {
min-height:       10px;
width:            770px;
margin:           10px auto 10px auto;
border-radius:    15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#unlock_box ul {
margin:            0 auto 0 auto;
padding:          20px;
border-radius:    15px;
width:            90%;
background-color:   #282535;
border:             black dotted 2px;
}

#unlock_box ul li {
 
margin:           5px 0 5px 0;
}

#unlock_box h1 {
font-size: 20px;
}

#unlock_box .go_back {
margin:            6px auto 0 auto;
padding:           0;
background-color:   #282535;
border:             black dotted 2px;
height: 30px;
line-height: 25px;
font-size: 20px;
width:            250px;
text-align: center;
}

#unlock_box .go_back img {
width: 30px; 
float: left;
}


#unlock_box #unlock_description {
width:            500px;
left:             0;
right:            0;
min-height:       16px;
margin:           50px auto 0 auto;
padding:          2px 5px 2px 5px;
text-align:       center;
color:            white;
border-radius:    10px;
padding:          0 0 10px 0;
position:         fixed;
z-index:          10;
display:          none;
opacity:          0;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#unlock_box #unlock_description #central_unlock_image {
float:            left;
margin:           15px 15px 15px 215px;
}

#unlock_box #unlock_description #close {
float: right;
margin: 15px;
position: relative;
}

#unlock_box #unlock_description p {
margin:           15px;
}

#unlock_box h4, #unlock_box h3 {
width:            370px;
clear:            both;
text-align:       center;
margin:           7px auto 7px auto;
padding:          2px 0 2px 0;
background-color:   #282535;
border:             black dotted 2px;
}

#unlock_box h4 {
font-size:        13px;
}

#unlock_box h3  {
width:            480px;
}

#unlock_box img {
float:            left;
margin-left:      9px;
margin-bottom:    5px;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

#unlock_box p img {
float: none;
}

#unlock_box img:hover, #unlock_box  .unlock_adv_display:hover {
opacity:          .30;
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
}

#unlock_box  .unlock_adv_display img:hover {
opacity:          1;
}

#unlock_box .faded_unlock {
opacity:          .30;
}

#unlock_box  .unlock_adv_display {
float: left;
margin: 10px;
}

.unlock_adv_display {
height: 50px;
width: 100px;
overflow: hidden;
position:relative;
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
}


.unlock_adv_display  .spr_image {
z-index: 4;
position: absolute;
}

.unlock_adv_display  p {
z-index: 5;
color: white;
text-align: left;
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;
position: absolute;
width: inherit;
font-size: 14px;
}

.staff_status, .staff_status_menu {
margin:           5px auto 0 auto;
width:            780px;
min-height:       50px;
border-radius:    15px;
padding-top: 10px;
clear:            both;
}

.staff_status {
display:          none;
}

.staff_status textarea {
margin: 0 auto 0 auto;
display: block;
width: 90%;
height: 100px;
}

.staff_status h4, .staff_status_menu h4 {
margin:           5px auto 5px auto;
text-align:       center;
}

.staff_status table, .staff_status_menu table {
margin:           10px auto 10px auto;
color:            white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
width: 100%;
}

.staff_status table th, .staff_status_menu th {
background-color:   #282535;
border:             black dotted 2px;
}

.staff_status table b {
color:            lime;
}

.staff_status fieldset {
margin:           0 2px 2px 2px;
border:           1px solid white;
}

.staff_status table input {
width:           140px;
}

.staff_status p {
text-align:      center;
color:           white;
margin:          0 0 0 0;
background:      black;
}

.extra_large_status_window .status_equip_box {
width:          98%;
height:         auto;
margin:         0px auto 0 auto;
text-align:     left;
background-color:   #282535;
border:             black dotted 2px;
}

.extra_large_status_window .status_equip td {
text-align: left;
}

.extra_large_status_window .status_equip img {
max-height:      50px;
border:          none;
padding-right: 10px;
}

.extra_large_status_window .status_equip a {
}

.extra_large_status_window .status_equip_box p {
margin:          5px 0 0 0;
font-size:       14px;
}

.extra_large_status_window#custom_sprites {

} 

.extra_large_status_window#custom_sprites img {
width: 100px;
transition:    all 1s ease;
}

.extra_large_status_window#custom_sprites img:hover {
width: 200px;
transition:    all 1s ease;
}

/* Creature Voting Menu */

#voting_legend {
width: 45%;
float: left;
margin-left: 5%;
}

#voting_legend tr th img {
}

#voting_list {
width: 45%;
float: left;
margin-left: 3%;
}

#voting_list tr td {
padding-bottom: 10%;
padding-top: 3%;
}

#voting_list tr td img {

}

#voting_list tr td img:hover {
opacity: .50;
-webkit-transition: opacity 1s linear;
transition:    opacity 1s linear;
}

/* end player status screen layout */
/* begin status screen layout */

.status_window .status_portrait {
height:         100px;
width:          100px;
display:        block;
margin:         5px auto 5px auto;
border:         2px solid black;
color:          white;
background-color:   #22212a;
border:             black dotted 2px;
}

.status_window .status_portrait .creature {
transform: scaleX(-1);
-webkit-transform: scaleX(-1);
height:         100px;
width:          100px;
}

.status_window table .status_portrait  {
border-radius: 15px;
width: 50px;
height: 50px;
}

.status_window table .push_down {
margin-bottom: -8px;
}

.status_window #first_superb{
float:       left;
margin-left: 8px;
}

.status_window, .small_status_window, .large_status_window, .extra_large_status_window {
height:         auto;
max-height:     600px;
float:          left;
margin:         2px 2px 2px 2px;
padding:        2px 0px 2px 0px;
color:          white;
text-align:     center;
color:          white;
overflow: auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.small_status_window {
width:          210px;
}

.status_window {
width:          290px;
}

.large_status_window {
width:          515px;
}

.extra_large_status_window {
width:          99%;
}


.status_window h6 {
background-color:   #282535;
border:             black dotted 2px;
margin: -2px 0 0 0;
padding: 0;
}

#profile #right_status {
margin: 5px 15px 5px 10px;
border-radius: 5px;
background-color:   #282535;
border:             black dotted 2px;
padding: 3px;
}

.status_window h5 {
clear:          both;
margin:         3px auto 3px auto;
}

.extra_large_status_window .default_spr_selection {
width: 50px;
-webkit-transition: width 1s linear;
transition:    width 1s linear;
}

.extra_large_status_window .default_spr_selection:hover {
width: 100px;
-webkit-transition: width 1s linear;
transition:    width 1s linear;
}

.small_status_window #discipline_display {
overflow: auto;
height: 180px;
}

.small_status_window #discipline_display h5 {
margin: 0;
}

.large_status_window #discipline_display .attribute_container {
float:          left;
width:          48px;
background-color:   #282535;
border-radius:  5px;
margin:         2px 5px 2px 5px;
font-size: 14px;
}

.large_status_window #discipline_display .attribute_container img {
width: 20px;
}

.status_window h4, .small_status_window h4, .large_status_window h4, .extra_large_status_window h4 {
margin:         5px auto 5px auto;
padding:        2px 0 2px 0;
color:          white;
font-weight:    normal;
background:     none;
border-radius: 6px;
width: auto;
}

.status_window h5, .small_status_window h5, .large_status_window h5, .extra_large_status_window h5 {
margin:         2px auto 2px auto;
padding:        2px 0 2px 0;
color:          white;
font-weight:    normal;
background-color:   #282535;
width: auto;
}

.status_window table, .small_status_window table, .large_status_window table, .extra_large_status_window table {
height:         90%;
width:          100%;
margin:         0 auto 0 auto;
font-size:      14px;
}

.status_window table b {
color:          lime;
}

.status_window table input {
width:          160px;
float:          right;
}

.status_window ul, .small_status_window ul, .large_status_window ul, .extra_large_status_window ul {
list-style:     none;
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
margin: -2px auto 0 auto;
}

.status_window ul li, .small_status_window ul li {
margin: 0;
padding: 0;
clear: both;
min-height: 30px;
line-height: 30px;
}

.status_window ul li img, .small_status_window ul li img {
float: left;
width: 30px;
}

.status_window p, .small_status_window p, .large_status_window p, .extra_large_status_window p {
padding:        3px 4px 3px 4px;
margin:         -2px auto 0px auto;
text-align:     left;
overflow:       hidden;
background-color:   #282535;
border:             black dotted 2px;
margin: 5px;
}

#profile #conv_form {
padding:        3px 4px 3px 4px;
margin:         -2px auto 0px auto;
}

.large_status_window p, .extra_large_status_window p {
padding: 8px;
}

.status_window #main_description {
min-height:         100px;
}

.status_window span {
margin:         6px 0 0 0;
display:        block;
}

.status_window table .held, 
.small_status_window table .held {
line-height:     12px;
}

.status_window table .held img, 
.small_status_window table .held img {
width:           30px;
height:          30px;
margin:          -14px 3px 3px 3px;
float:           left;
}

.status_window table th, 
.small_status_window table th, 
.large_status_window table th,
.extra_large_status_window th {
font-weight:    normal;
background-color:   #282535;
border:             black dotted 2px;
}

.extra_large_status_window .tat_area {
width: 30px;
}

.status_window .image_pn_box, .large_status_window .image_pn_box, .extra_large_status_window .image_pn_box {
background-size: 30px 30px;
}

#view_status_menu {
clear: both;
margin: 5px 1px 5px 10px;
overflow: auto;
}

#view_status_menu h4 {
margin: 0px 0 0 0;
padding: 0;
width: 270px;
}

#view_status_menu img {
width:             30px; 
height:            30px;
background-color:   #22212a;
border:     #4e4d5e dotted 2px;
padding:           4px;
margin-top: -3px;
border-top: none;
border-bottom-right-radius:    10px;
border-bottom-left-radius:     10px;
}

#view_status_menu input {
width: 130px;
float: left;
margin-left: 4px;
margin-bottom: 4px;
}

#view_status_menu img:hover {
-webkit-transition: background-color 1s linear;
transition:    background-color 1s linear;
}

#outfit_selection .image_pn_box {
width: 276px;
}

#outfit_output {
text-align: center;
font-size: 18px;
padding: 5px; 
margin: 5px;
color:          white;
background-color:   #282535;
border:             black dotted 2px;
border-radius: 15px;
text-decoration: none;
font-weight:normal;
}

#outfit_sprite_selector {
background-color:      #353749;
border: black dotted 2px;
padding: 10px;
width: 100%;
clear: both;
}

#outfit_sprite_selector h4 {
margin: -6px 0 4px 0;
padding: 0;
}

.outfit_tab {
width: 96%;
float: left;
margin: 1% 1% 1% 1%;
padding: 0;
border-radius: 15px;
background-color: #2f2d3f;
border: black dotted 2px;
}

.outfit_tab .outfit_spr {
float: left;
width: 23%;
}

.outfit_tab p {
height: auto
overflow: auto;
display: block;
border-radius: 15px;
margin-bottom: 8px;
background-color:   #282535;
border:             black dotted 2px;
width: 50%;
float: left;
}

.outfit_tab .unlock_req {
background-color: #571010;
width: 50%;
float: left;
}

.extra_large_status_window #evo_wrapper {
height: 325px;
}

.extra_large_status_window #evo_wrapper .evo_spr {
z-index: 10;
width: 200px;
}

.extra_large_status_window #evo_wrapper #evolution_details {
width: 200px;
position: absolute;
margin-left: 300px;
}

.extra_large_status_window #evo_wrapper #evolution_details h5 {
font-size: 16px;
}

.extra_large_status_window #evo_wrapper #evolution_details p {
font-size: 14px;
margin-top: 0%;
display: block;
width: 180px;
text-align: center;
}

.extra_large_status_window #evo_wrapper #evolution_details .evolution_item_pic {
clear: both;
margin: 0 auto 0 auto;
}

.extra_large_status_window #evo_wrapper #evo_user_details {
clear: both;
}

.extra_large_status_window #evo_wrapper #left_evolution_sprite {
margin-left: -400px;
position: absolute;
transform: scaleX(-1);
-webkit-transform: scaleX(-1);
}

.extra_large_status_window #evo_wrapper #right_evolution_sprite {
margin-left: 200px;
position: absolute;
}

.extra_large_status_window #evo_wrapper #evo_user_details {
margin-top: 200px;
}

.extra_large_status_window #evo_wrapper #evo_user_details #evolve_button {
clear: both;
display: block;
margin: 0 auto 0 auto;
margin-top: 20px;
margin-bottom: 10px;
}

.extra_large_status_window #evo_wrapper #evolution_message {
color: yellow;
position: absolute;
margin-top: 70px;
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;
margin-left: 270px;
font-size: 30px;
z-index: 15;
display: none;
}




/* end status screen layout */
/* begin account management layout */

#manage_box {
width:              780px;
min-height:         400px;
margin:             8px auto 10px auto;
padding:            0 0 12px 0;
color:              white;
font-size:          12px;
}

#manage_box b {
color:             lime;
}

#manage_box h3 {
margin:              0 auto 0 auto;
text-align:          center;
color:                 white;
}

#manage_box  #account_menu_bar {
clear: both;
width: 100%;
}

#manage_box  #account_menu_bar h3 {
margin: 10px 0 10px 0;
}

#manage_box  #account_menu_bar ul {
margin: 0;
padding: 0;
}

#manage_box  #account_menu_bar li {
float: left;
list-style: none;
margin-left: 8px;
padding: 0;
}

#manage_box #info_menu {
width:                110px;
float:                left;
margin:               0 0 0 0px;
}

#manage_box #info_menu #avatar {
height:               100px;
width:                100px;
text-align:           center;
margin:               0px auto 0 auto;
display:              block;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;

}

#manage_box #info_menu h5, #player_list_box h5 {
background-color:   #282535;
border:             black dotted 3px;
margin:               5px 0 5px 0;
text-align:           center;
}

#manage_box #info_menu ul {
list-style:           none;
padding:              0 0 0 0;
margin:               0 0 0 0;
background-color:     #101f48;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;

}

#manage_box #info_menu ul li {
padding:             3px 0 3px 0px;
line-height:         20px;
text-align: center;
}

#manage_box #info_menu ul li img {
float: left;
}

#manage_box #info_menu ul li:hover {
background-color:   #282535;
}

#manage_box #info_menu  ul li a {
text-decoration:       none;
color:                 #d2dff5;
}
#manage_box #info_menu ul li a:hover {
color:                 #8eabde;
}

#manage_box .player_information {
height:                428px;
width:                 660px;
margin:                0 0 0 10px;
padding:               0 0 0 5px;
float:                 left;
display: none;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
border-bottom: none;
}

#player_status_box table {
margin-bottom:         5px;
}

#manage_box .player_information th {
background-color:   #282535;
border:             black dotted 2px;
}

#manage_box .player_information td {
text-align: center;
}

#manage_box .player_information th img {
float: left;
}

#manage_box #account_options {
width:                755px;
background-color:      #353749;
border: black dotted 2px;
clear:                both;
padding:              10px;
margin:               5px 0 0 0;
background: rgba(53,55,73,0.90);
}

#manage_box #account_options p {
background-color:   #282535;
border:             black dotted 2px;
margin:          5px auto 5px auto;
padding:         10px;
clear:           both;
color:           white;
border-radius: 5px;
}

#manage_box #account_options h4 {
text-align:          center;
border-radius:       15px;
font-size:           140%;
padding:             0px;
margin:              0px;
background-color:   #282535;
border:             black dotted 2px;
}

#manage_box #account_options h5 {
text-align: center;
font-size:           100%;
background-color:   #282535;
border:             black dotted 2px;
}



#manage_box #account_options table {
clear:              both;
}

#manage_box #account_options table th {
padding:            5px 0 5px 0;
font-size:          10px;
}

#manage_box #account_options .tracked_auctions {
}

#manage_box #account_options .tracked_auctions div {
width: 750px;
height: 80px;
}

#manage_box #account_options .tracked_auctions p {
float:    none;
clear:    none;
}

#manage_box #account_options .tracked_auctions div img {
width:    50px; 
height:   50px;
float:    left;
margin-right: 15px;
}

#npc_box #additional_auction_menu .tracked_auctions .close {
width: 30px; 
height: 30px; 
float: right;
}

#manage_box #account_options textarea:focus {
}

#manage_box #account_options textarea {
width:             725px;
height:            75px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
margin:            0 auto 0 auto;
border-radius:     10px;
color:             white;
padding:           3px;
}

#player_accolades_list {
width:                637px;
margin-left: 120px;
background-color:      #353749;
border: black dotted 2px;
clear: both;
padding: 10px;
overflow: auto;
border-top: none;
}

#player_accolades_list h3 {
text-align: left;
margin: 5px 10px 5px 20px;
}

#player_accolades_list p {
padding: 5px;
border:            black dotted 2px;
background-color:  #2c2b34;
}

#player_accolades_list div {
float: left;
margin: 5px;
border:            black dotted 2px;
background-color:  #2c2b34;
padding: 5px;
border-radius: 15px;
}

/* end account management layout */
/* Begin General Layout */

#daily_reward_box {
display: block;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
width: 98%;
margin: 0 auto 0 auto;
}

#daily_reward_box .daily_reward {
float: left;
border-radius: 10px;
margin: 15px;
padding: 10px;
width: 18%;
height: 130px;
overflow: auto;
background-color:   #282535;
border:             black dotted 2px;
}

#daily_reward_box .daily_reward h4 {
margin: 0;
}

#daily_reward_box .daily_reward img {
width: 40px;
margin: 0 auto 0 auto;
display: block;
}

#daily_reward_box .daily_reward p {
clear: both;
text-align: center;
font-size: 14px;
}

#daily_reward_box .daily_reward input {
margin: 0 auto 0 auto;
display: block;
}

#sprite_sheet_reward_box {
}

#sprite_sheet_reward_box .spr_sheet_notice {
padding: 10px;
margin: 10px;
background-color:      #353749;
border: black dotted 2px;
}

#sprite_sheet_reward_box #sheet_links, #sprite_sheet_reward_box #claim_box {
border-radius: 15px;
margin: 0 auto 15px auto;
background-color:      #353749;
border: black dotted 2px;
width: 700px;
padding: 15px;
clear: both;
}

#sprite_sheet_reward_box #sheet_links #close_button {
width: 40px;
}

#sprite_sheet_reward_box .sheet_box div {
float: left;
background-color:      #353749;
border: black dotted 2px;
border-radius: 15px;
margin: 10px;
width: 140px;
min-height: 180px;
}

#sprite_sheet_reward_box .sheet_box .token_img {
width: auto;
float: none;
display: inline;
margin-left: 3px;
}

#sprite_sheet_reward_box .sheet_box .pn_box_link {
padding: 0px 5px 0px 5px;
}

#sprite_sheet_reward_box .sheet_box div h5 {
text-align: center;
background-color:   #282535;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
margin: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

#sprite_sheet_reward_box .sheet_box .faded {
opacity: .50;
background-color: #591515;
}

#sprite_sheet_reward_box .sheet_box img {
width: 100px;
margin: 0 auto 0 auto;
display: block;
}

#sprite_sheet_reward_box .sheet_box p {
margin: 2px;
padding: 0;
text-align: center;
}

#general_display {
padding:           10px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
margin: 10px 15px 15px 15px;
}

#general_display table h4 {
margin:            10px;
background-color:   #282535;
border:             black dotted 2px;
}

#general_display b.warnings {
color: red; 
font-size: 25px;
}

#general_display b.noticeme {
color: lime; 
font-size: 25px;
}

#general_display #report_body {
width: 700px;
max-width: 700px;
height: 200px;
}


#general_display p, 
#general_display ul,
#general_display ol {
background-color:   #282535;
border:             black dotted 2px;
padding:         10px;
border-radius:   10px;
margin: 5px;
}

#general_display ul,
#general_display ol {
padding:  5px 0 5px 30px;
}

.pn_box_link,.pn_box_link:visited,.pn_box_link:link {
text-decoration:  none;
padding:          5px 5px 5px 45px;
font-size:        15px;
display:           inline;
background-repeat: no-repeat;
}

.pn_box, .pn_textarea, .long_url, .image_pn_box, 
.pn_box_link,.pn_box_link:visited,.pn_box_link:link, .button_inspection, 
.battle_row_container .swapper, #mass_dungeon_rewards ul li .sell_reward  {
color:              white;
background-color:   #5e5d70;
border:             black dotted 3px;
}

.button_inspection {
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
margin-left: -1px;
}

.pn_box, .long_url, .image_pn_box, .pn_box_link,.pn_box_link:visited,.pn_box_link:link {
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
-webkit-text-fill-color: white !important; 
}

.pn_box:hover, .long_url:hover, .image_pn_box:hover,.pn_box_link:active,.pn_box_link:hover, .creature_battle_display .swapper:hover, #mass_dungeon_rewards ul li .sell_reward:hover {
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
color:             white;
}

.pn_box_link:hover {
background-color:  #b8c6e0;
color:             white;
}

select.pn_box {
background-color:   #4e4d5e;
border:             black dotted 2px;
}

select.pn_box:hover {
background-color:   #4e4d5e;
border:             black dotted 2px;
}

.image_pn_box {
width:            120px;
height:           30px;
background-repeat: no-repeat;
background-position:center left;
padding-left: 30px;
}

.image_pn_box:hover {
background-repeat: no-repeat;
background-position:center left;
}

.long_url {
width: 500px;
}


.pn_textarea {
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}


/* End General Button Layout */
/* begin custom layout */

.outer_custom_box {
color:        white;
width:        96%;
margin:       20px auto 20px auto; 
}

.outer_custom_box .inner_custom_box {
width:        90%;
padding:      20px 20px 20px 20px;
margin:       20px auto 20px auto; 
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.outer_custom_box .inner_custom_box h3,
.outer_custom_box .inner_custom_box table th {
margin: 5px auto 5px auto;
padding: 2px;
text-align: center;
background-color:   #282535;
border:             black dotted 2px;
}

.outer_custom_box .inner_custom_box h2 {
font-size: 22px;
width: 96%;
margin: 0px 0 5px 0;
padding: 2px;
text-align: center;
}

.outer_custom_box .inner_custom_box h3 {
font-size: 18px;
width: 96%;
}

.outer_custom_box .inner_custom_box table {
margin: 0 auto 0 auto;
width: 96%;
padding: 4px;
background-color: #2f2d3f;
border:             black dotted 2px;
}

.outer_custom_box .inner_custom_box ul {
background-color: #2f2d3f;
padding: 5px 5px 5px 25px;
border:             black dotted 2px;
}

.outer_custom_box .inner_custom_box table input,
.outer_custom_box .inner_custom_box table select,
.outer_custom_box .inner_custom_box input,
.outer_custom_box .inner_custom_box select,
.outer_custom_box .inner_custom_box table textarea,
.outer_custom_box .inner_custom_box textarea  {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
color: white;
margin: 5px;
}

.outer_custom_box .inner_custom_box table input:hover,
.outer_custom_box .inner_custom_box table select:hover,
.outer_custom_box .inner_custom_box input:hover,
.outer_custom_box .inner_custom_box select:hover,
.outer_custom_box .inner_custom_box table textarea:hover,
.outer_custom_box .inner_custom_box textarea:hover  {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
color: white;
margin: 5px;
}

.outer_custom_box .inner_custom_box table textarea,
.outer_custom_box .inner_custom_box textarea {
width: 96%;
}

.outer_custom_box .inner_custom_box p {
background-color:      #4e4d5e;
border: black dotted 2px;
padding: 5px; 
margin: 10px;
border-radius: 5px;
}

.outer_custom_box .inner_custom_box .range {
width: 40px;
}

.outer_custom_box .inner_custom_box .skill_box .skill_name {
width: 200px;
}

.outer_custom_box .inner_custom_box .skill_box textarea {
margin:       0 auto 0 auto;
width:        80%;
height:       80px;
display:      block;
}

.outer_custom_box .inner_custom_box .file_upload {
width: 600px;
}


/* end custom layout */
/* begin player lists */

#player_list_box {
margin: 0 auto 0 auto;
padding: 10px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#player_list_box div input {
float:        left;
}

#player_list_box div h5 {
clear:         both;
}

#player_list_box div div {
height:                20px;
width:                 148px;
display:               block;
overflow:              hidden;
float:                 left;
padding:               2px 2px 2px 2px;
margin:                0 4px 4px 0;
background-color:   #282535;
border:             black dotted 2px;
text-align:            right;
font-size:             14px;
}

#player_list_box div .faded {
opacity: .50;
}

#player_list_box div div h4 {
font-size: 12px;
margin: 0;
padding: 0;
}


#player_list_box div div img {
float:            left;
width:            20px;
height:           20px;
}

/* end player lists layout */
/* begin Aavatar selection */

#avatar_browser {
background-color: #282535;
border: black dotted 2px;
margin: 25px;
padding: 10px;
}

#avatar_browser .folders {
float:                 left;
width:                 154px;
height:                50px;
margin:                10px;
padding:               5px;
background:            #353749 url(../images/icons/folder.png) no-repeat;
background-position: top right;background-color:      #353749;
background-size:       60px 60px;
border:                black solid 2px;
line-height: 50px;
-webkit-transition: all 1s ease;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
}

#avatar_browser ul {
margin: 10px auto 10px auto;
width: 75%;
}

#avatar_browser .folders a {
overflow:              hidden;
display:               block;
outline:               none;
text-decoration: none;
}

#avatar_browser .folders:hover {
background-color: black;
}

#avatar_browser .folder_avatar {
border:                black solid 2px;
margin:                20px 0 20px 36px;
background:            #353749;
}

#avatar_browser .folder_avatar:hover {
opacity:                .30;
}

/* end account management layout */


#battle_in_progress {
display:          block;
clear:            both;
padding:          15px;
}

#battle_in_progress h4 {
background-color: #411852;
border-radius:    10px;
margin:           0px auto 0px auto;
text-align:       center;
border:           black solid 2px;
font-weight:      normal;
padding:          5px;
}

.camp_notification {
width:            810px;
color: white;
border-radius: 10px;
margin: 0 auto 5px auto;
padding: 0;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.camp_notification h4 {
min-width:       300px; 
text-align:      center; 
border:          none; 
color:           white;
margin:          1px 1px 1px 1px;
font-weight:     normal;
border-radius: 10px;
text-align: center;
margin: 0;
padding: 0;
background-color:   #282535;
border:             black dotted 2px;
}

.camp_notification p {
text-align: center;
}

/* begin camp layout */

.floating_camp_menu {
width:            550px;
overflow:         auto;
max-height:       70vh;
left:             0;
right:            0;
min-height:       16px;
margin:           4px auto 0 auto;
padding:          2px 5px 2px 5px;
text-align:       center;
color:            white;
border-radius:    10px;
padding:          0 0 10px 0;
position:         fixed;
z-index:          17;
display:          none;
}

.floating_hover_menu h3 {
text-align: center;
font-size: 25px;
}

.floating_hover_menu h4 {
font-size: 20px;
}

.floating_camp_menu,
.floating_hover_menu {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:           black dotted 6px;
}

.floating_camp_menu p,
.floating_hover_menu p {
background-color:   #282535;
border:             black dotted 2px;
padding:           5px;
margin:           5px 25px 5px 25px;
border-radius:    15px;
text-align:       left;
max-height:       125px;
overflow: auto;
}

.floating_hover_menu {
width:              680px;
min-height:         103px;
padding:            0 0 0 10px;
margin:             0px 0 0 0px;
border-radius:      15px;
position:           fixed;
box-shadow:         5px 5px 10px black;
z-index:            40;
display:            none;
color:              white;
}

#party_log_display_box textarea {
width:              660px;
margin: 0 auto 10px auto;
height: 200px;
}

.floating_hover_menu .close, .floating_camp_menu .close {
float:          right;
margin:         15px 15px 0 0px;
}

.floating_camp_menu .food_item_image {
float: left;
margin: 0px 5px 5px 5px;
width: 30px;
border: black solid 2px;
}

#camp_notice {
width:            813px;
min-height:       16px;
margin:           0px auto 0 auto;
padding:          2px 5px 2px 5px;
text-align:       center;
color:            white;
border:           #243f6d solid 2px;
position:         fixed;
border-top:       none;
z-index:          15;
margin:           0px auto 0 auto;
top:              48px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;
}

#camp_notice #camp_info_header {
}

#camp_notice #camp_info_header h4  {
min-width:       300px; 
text-align:      center; 
border:          none; 
color:           white;
margin:          1px 1px 1px 1px;
font-weight:     normal;
border-radius: 10px;
background-color:   #282535;
border:             black dotted 2px;
}

#camp_notice #camp_info_header p {
margin:          0 auto 0 auto;
padding:         4px;
max-height: 48px;
}

#camp_notice #camp_info_header h4 b {
color:           lime;
}

#camp_notice #top_menu_buttons {
width:            810px;
max-height:       80px;
min-height:       16px;
margin:           0px auto 0 auto;
text-align:       center;
color:            white;
position:         relative;
overflow: auto;
z-index: 15;
}

#camp_notice #top_menu_buttons #menu_lock {
float: right;
}

#top_menu_buttons ul li #bu_st, 
#top_menu_buttons ul li  #bu_lo, 
#top_menu_buttons ul li #bu_hide {
 float: left; 
  width: 70px;
}

#top_menu_buttons ul li  #bu_sw, 
#top_menu_buttons ul li  #bu_un, 
#top_menu_buttons ul li #bu_unhide {
float: left; 
width: 50px; 
height: 30px;
font-size: 11px;
}

#top_menu_buttons ul {
margin: 6px 0 0 -40px;
list-style: none;
}

#top_menu_buttons ul li {
float: left;
margin-right: 5px;
}

#top_menu_buttons ul li img {
float: right;
width: 30px;
}

#top_menu_buttons input {
min-height: 35px;
}

#top_menu_buttons .button_inspection {
min-height: 32px;
}

#camp_notice p {
width: 800px;
max-width: 800px;
padding: 5px;
border: none;
height:           auto;
max-height:       70px;
background-color: transparent;
text-align: center;
color: white;
overflow: auto;
}

#camp_notice table {
margin:           0 auto 0 auto;
}

.inventory_containers {
margin-top: 0px;
}

#creature_changer.inventory_containers {
margin-top: 0px;
}

#inventory_holder {
margin-top: 120px;
}

#creature_changer #inventory_holder {
margin-top: 150px;
overflow: auto;
}

.camp_info {
width:            300px;
color:            white;
margin:           0px auto;
}

#creature_changer .camp_creature, .creature_card {
width:         150px;
min-height:    200px;
float:         left;
-webkit-transition: border-color 1s ease;
transition:         border-color 1s ease;
margin:        10px 5px 0 5px;
border-radius: 10px;
overflow: hidden;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;
}

#creature_changer .camp_creature .magnifier, .creature_card .magnifier {
float:          right;
width: 25px;
height: 25px;
}

#creature_changer .camp_creature h6, .creature_card h6 {
min-height:    20px;
text-align:    center;
margin:        5px 5px 5px 5px;
font-size:     14px; 
}

#creature_changer .camp_creature h6 b, .creature_card h6 b {
width: 80px; 
display: block;
float: left;
text-overflow:     ellipsis;
white-space:       nowrap;
overflow:          hidden;
-o-text-overflow:  ellipsis;  
}

#creature_changer .camp_creature .timer {
float:         left;
margin-right: -15px;
}

#creature_changer .camp_creature .possessed {
color:         red;
}

#creature_changer .camp_creature .possessed a:hover {
color: #6d0f0f;
}

#creature_changer .camp_creature table, .creature_card table {
margin:        0 0 0 0;
font-size:     13px;
}

#creature_changer .camp_creature .camp_sprite, .creature_card .card_spr {
height:        125px;
width:         125px;
display:       block;
margin:        0 auto 0 auto;
background-size: 125px 125px;
-webkit-transition: opacity 1s linear;
transition:    opacity 1s linear;
transform: scaleX(-1);
-webkit-transform: scaleX(-1);
background-repeat: no-repeat;
 background-position: center;
background-color: #22212a;
border: black dotted 2px;
}

#creature_changer .camp_creature .camp_sprite p, .creature_card .card_spr p {
margin: 0 0 0 0px;
font-size: 10px;
color: white;
background:   rgba(0,0,0,0.5);
padding:     2px 1px 2px 5px;
transform: scaleX(-1);
-webkit-transform: scaleX(-1);
}

#creature_changer .camp_creature .camp_sprite p img, .creature_card .card_spr p img {
margin-bottom: -3px;
margin-right: 2px;
}

#creature_changer .camp_creature .camp_sprite:hover {
opacity: .30;
}

.order_menu {
clear:            both;
position:         fixed;
background-color: #19121a;
background:       rgba(25,18,26,0.9);
bottom:           0; 
width:            980px;
margin-left:      -80px;
z-index: 25;
}

.order_menu#item_order_menu {
width:            850px;
padding-left: 40px;
}

.order_menu img {
-webkit-transition: all .5s ease-in;
border-radius: 15px;
max-height: 60px;
}

.order_menu img:hover {
opacity: .75;
}

.order_menu .camp_controls {
width: 720px;
height: 50px;
float: left;
margin-left: 30px;
padding-left: 0;
}

.order_menu .camp_controls .left_arrow {
float: left;
}

.order_menu .camp_controls .right_arrow {
float: right;
}

.order_menu .camp_controls .order_menu_selectors {
position: absolute;
margin-left: 240px;
width: 220px;
margin-top: 0px;
}

.order_menu .camp_controls .order_menu_selectors select {
float: left;
width: 180px;
}

.order_menu#party_order_menu .camp_controls .order_menu_selectors {
width: 280px;
}

.order_menu#party_order_menu .camp_controls .order_menu_selectors input {
float: left;
width: 100px;
height: 50px;
}

.order_menu .camp_controls .order_menu_selectors p {
padding: 0;
margin: 0;
float: left;
width: 40px;
text-align: center;
}

.order_menu #skip_button {
float: right;
}

.order_menu .left_check {
float: left;
margin: 10px 10px 0 10px;
}

.order_menu .right_check {
float: right;
margin: 10px 10px 0 0px;
}

.order_menu .left_check:hover, .order_menu .right_check:hover {
opacity: .50;
-webkit-transition: opacity 1s ease-in;
transition:    opacity 1s ease-in;
}


/* end camp layout */

/* begin training/duel mode layout */

#stretch_display_box.darkening {
background-position: bottom;
background-repeat: no-repeat;
background-size: cover;
}

#after_battle h4, #formation_menu h4, #battle_formation_menu h4 {
text-align:         center;
padding:            2px 0 2px 0;
margin:             0 0 0 0;
font-size:          14px;
}

#after_battle {
display: inline;
width: 300px;
padding: 2px;
}

#after_battle a {
text-decoration:    none;
}


#after_battle h2 {
text-align:         center;
padding:            0 0 0 0;
margin:             0 0 0 0;
border-radius:      15px;
background-color:   #282535;
border:             black dotted 2px;
font-size:          16px;
}


#after_battle #exit_link #exit_button {
background:         none;
color:              lime;
border:             none;
margin:             0;
padding:            0;
text-decoration: underline;
}

#after_battle #exit_link #exit_button:hover {
color:              violet;
}

#after_battle table {
margin:             0 auto 0 auto;
}

#admin_battle_menu {
margin: 0 auto 0 auto; 
}

#formation_menu, #battle_formation_menu {
width: 300px;
}

#formation_menu, #after_battle, #battle_formation_menu, #battle_formation_menu {
margin-top:         200px;
margin-left: 250px;
position: absolute;
}

#battle_party_member_modifier {
margin-top: 120px;
margin-left: 80px;
}

#party_adventure_menu {
margin-left:        160px;
width:              500px; 
}

.close {
float:              right;
margin-top:         5px;
margin-right:        5px;
width: 30px;
height: 30px;
}

#party_adventure_menu #adventure_info_display table {
margin:              0 auto 0 auto;
background-color:   #282535;
border:             black dotted 2px;
padding:             5px;
}

#party_adventure_menu h4 {
clear:             both;
}

#party_adventure_menu input {
display:           block;
margin:            0 auto 0 auto;
}

#party_adventure_menu select {
display:           block;
margin:            0 auto 0 auto;
}

#party_adventure_menu div {
margin:       0 15px 5px 15px;
}

#party_adventure_menu div .reward {
float:               left;
width:               170px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:       10px;
padding:             3px 2px 3px 2px;
text-overflow:     ellipsis;
}


#party_adventure_menu div .reward span {
float: left;
width: 100px;
margin-left: 4px;
}

#party_adventure_menu div .reward img {
margin-left:  5px;
width: 30px;
height: 30px;
float: left;
}

#party_adventure_menu .sm_key_item {
width: 30px;
}

#party_adventure_menu div .bounty_information p {
overflow: auto;
}

#party_adventure_menu div .bounty_information .bounty_img {
float: left;
width: 50px;
margin: 5px 5px 5px 2px;
border:              #243f6d solid 2px;
border-radius:       10px;
}


#formation_menu #formation_image, 
#battle_formation_menu #formation_image,
#party_formation_menu #selected_formation_image {
float:              left;
margin:             5px;
}

#formation_menu select, 
#battle_formation_menu select {
margin-left:        30px;
}

#party_formation_menu  p, #party_adventure_menu p {
width:               80%;
padding:             10px;
min-height:          60px; 
border-radius:       10px;
display:             block;
margin:              5px auto 5px auto;
background-color:   #282535;
border:             black dotted 2px;
}

#party_formation_menu select {
margin-left:        85px;
}

#party_sorting_options {
position:          absolute;
margin:            15px 0 0 220px;
}

#formation_menu input, 
#battle_formation_menu input {
clear:             both;
margin:            10px 0 0 105px;
}

#party_formation_menu input, #marble_addition_menu input {
clear:             both;
margin:            10px 0 0 60px;
}

.battle_inaction {
width:             172px;
height:            24px;
padding-top:       2px;
color:             white;
border:            #132b54 solid 2px;
background:        #22212a;
border:            none;
text-align:        center;
background-repeat: no-repeat;
position:          absolute;
border-radius:     10px;
margin:            35px 0 0 290px;
}

.text_bubble, .text_bubble_2, .text_bubble_3, .text_bubble_4 {
background: url(../images/bubbles/1.png) no-repeat;
width:              97px;
height:             51px;
padding:            2px 2px 2px 2px;
margin:             0 0 0 0;
color:              black;
visibility:         hidden;
pointer-events:   none;
z-index: 10;
}

.text_bubble_2 {
background: url(../images/bubbles/2.png) no-repeat;
visibility:         visible;
}

.text_bubble_3 {
background:   url(../images/bubbles/3.png) no-repeat;
padding-top:        13px;
visibility:         visible;
height:             38px;
}

.text_bubble_4 {
background:   url(../images/bubbles/4.png) no-repeat;
padding-top:        13px;
visibility:         visible;
height:             38px;
}

.fade_turn_avatar, .turn_avatar {
width:             26px; 
height:            26px; 
margin:            0 0 0 5px; 
border:            #132b54 solid 2px;
background:        #22212a;
color:             #b8c6e0;
border-radius:     5px;
}

.fade_turn_avatar {
opacity:            .30;
}

#turn_info_container {
width:              598px;
margin:             0 25px 0 25px;
float:              left;
}

#turn_info_container h4 {
margin:             3px 148px 0 148px;
width:              300px;
border-radius:      15px;
background-color:   #282535;
border:             black dotted 2px;
font-size:          12px;
float:              left;
display:            block;
}

#turn_info_container img {
background-color:   #22212a;
border:            #4e4d5e dotted 2px;
}

#turn_info_container h2 {
margin:             14px 0 0 148px;
width:              300px;
font-size:          15px;
display:            block;
float:              left;
background:         black;
border:             2px solid black;
}

#turn_info_container input {
width:              34px;
margin:             0 3px 0 3px;
color:              white;
background:         black url(../images/gradients/10.png);
border:             none;
}

#battle_header_container {
width:              750px;
height:             72px;
color:              white;
margin:             5px auto 0 auto;
padding:            0px 0 0 0;
text-align:         center;
}

#battle_header_container .avatar_box {
width:              50px;
margin:             0px 0 0 0;
float:              left;
}


#battle_header_container .avatar_box .avatar {
width:              50px;
height:             50px;
border:             none;
display:            block;
background-color:   #22212a;
border:            #4e4d5e dotted 2px;
border-radius:     5px;
}

#battle_header_container .avatar_box .avatar:hover {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#battle_header_container .avatar_box .complete_formation {
position:           absolute;
margin-top:         10px;
overflow:           hidden;
}

#battle_header_container .avatar_box p {
margin:             0 0 0 0;
padding:            0 0 0 0;
width:              40px;
height:             18px;
font-size:          12px;
}


#duel_battle_box {
width:              750px;
min-height:         194px;
margin:             5px auto 0 auto;
border:             2px solid black;
}

.duel_box {
width:             205px;
min-height:        205px;
padding:           5px 5px 5px 5px;
float:             left;
}

.duel_sprite {
width:            100px;
height:           100px;
display:          block;
margin:           0 0 0 50px;
border:           1px solid;
}

.duel_box table {
color:            white;
margin:           0 auto 0 auto;
}

.duel_box table tr td input {
width:            80px;
}

.duel_box table tr td img {
border:           none;
width:            20px;
height:           20px;
}

#training_box {
overflow:         auto;
padding:          0 2px 0 2px;
}

#player_duel_text_box {
height:           202px;
width:            311px;
float:            left;
}

#player_duel_text_box textarea, .duel_text {
height:           80px;
width:            311px;
}

.duel_text {
background-color: black;
color:            white;
border:           1px solid white;
padding:          0 2px 0 2px;
overflow:         auto;
}

#player_duel_text_box h4 {
padding:          0 0 0 0;
margin:           0 0 0 0;
color:            white;
font-weight:      normal;
text-align:       center;
width:            311px;
}

#player_duel_chat input {
margin:           0 2px 0 2px;
float:            left;
}

.game_timer {
width:            724px;
min-height:       20px;
margin:           0 auto 0 auto;
padding:          0 0 0 0;
text-align:       center;
color:            white;
border:           1px solid black;
border-radius:    15px;
background:       rgba(0,0,0,0.5);
}

.game_timer input {
background:      none;
border:          none;
color:           lime;
width:           50px;
}

#some_action_1 {
width:            100px;
}

#some_action_2 {
width:            100px;
}

#training_options {
margin:           5px auto 0 auto;
width:            310px;
display:          block;
color:            white;
}

#training_options select {
width:            100px;
}

.vanish_element {
visibility: hidden;
}

#bottom_duel_box {
height:           28px;
width:            700px;
padding:          0 40px 0 10px;
margin:           0 auto 5px auto;
clear:            both;
color:            white;
background-repeat: no-repeat;
}

#bottom_duel_box input {
float:            left;
margin:           4px 0 0 44px;
}

#battle_rules {
margin:           0 auto 4px auto;
width:            700px;
padding:          0 10px 0 10px;
color:            white;
border-radius:    15px;
background:       rgba(0,0,0,0.5);
}

#battle_rules th{
padding:          0px 3px 0px 3px;
}

#battle_rules td {
color:            lime;
}

.url_bar {
min-width:        360px;
background:       black;
color:            white;
margin:           0px 0 0 0px;
display:          block;
font-size:        12px;
float:            left;
border:           1px solid white;
}

/* end training/duel layout */
/* begin battle layout */

.selectReplacement {
position:       absolute;
z-index:        10;
}

ul.selectReplacement {
margin:           0;
padding:          0;
height:           1.65em;
width:            100px;
}

ul.selectReplacement li {
border:            black solid 2px;
background:        #213059;
color:             #b8c6e0;
color:            #fff;
cursor:           pointer;
display:          none;
list-style:       none;
margin:           0;
padding:          1px 12px;
width:            140px;
height:           12px;
font-size:        11px;
line-height:      11px;
}

ul.selectReplacement li:hover {
background:        #b8c6e0;
color:             #22212a;
}

ul.selectOpen li {
display:          block;
}

ul.selectReplacement li.selected {
display:          block;
}

ul.selectOpen li.selected {
display:          block;
}

ul.selectOpen li:hover,
ul.selectOpen li.hover,
ul.selectOpen li.selected:hover {
}


#battle_changer {
}

.battle_row_container {
width:           750px;
margin:          5px auto 0 auto;
color:           white;
clear:           both;
}

.battle_row_container .battle_table_r,
.battle_row_container .battle_table_l {
float:          left;
position: absolute;
}

#battle_menu_1 {
display: block;
}

.battle_row_container .battle_table_r {
margin:         5px 48px 25px 285px;
opacity: 1;
}

.battle_row_container .battle_table_l {
margin:         5px 20px 25px 48px;
opacity: 1;
}

.battle_row_container .battle_table_r table,
.battle_row_container .battle_table_l table {
float:          left;
}

.battle_row_container .battle_table_r input,
.battle_row_container .battle_table_l input 
{
width:          82px;
height:         25px;
font-size:      11px;
}

.battle_row_container .battle_table_r select,
.battle_row_container .battle_table_l select 
{
width:          170px;
font-size:      11px;
}

.battle_row_container .left_slider, 
.battle_row_container .action_slider {
height: 100px;
float: left;
-webkit-transition: opacity .5s ease-in;
transition:    opacity .5s ease-in;
}

.battle_row_container .action_slider:hover, 
.battle_row_container .left_slider:hover {
opacity: .50;
}

.creature_battle_display {
width:          250px; 
float:          left;
/*  border:         red solid 1px; */
}

.creature_battle_display .creature_holder_r,
.creature_battle_display .creature_holder_l {
/* border:          blue solid 1px; */
}

.battle_row_container .swapper {
margin: 60px 0 0 -225px;
background-size: 20px 20px;
background-image: url(/images/icons/buttons/top-menu/parties.png);
background-repeat: no-repeat;
text-align: left;
padding-left: 30px;
transform:rotate(90deg);
}

.creature_battle_display .creature_holder_r h4,
.creature_battle_display .creature_holder_l h4 {
width:           100px;
margin:          0;
padding:         0;
display:         block;
color:           white;
text-align:      center;
font-size:       12px;
background-repeat: no-repeat;
background-position:center;
border: black     solid 1px;
border-radius:    5px;
}

.creature_battle_display .r_b_type {
float: left;
margin-left: -32px;
width: 20px;
height: 20px;
}

.creature_battle_display .l_b_type {
float: right;
margin-right: -30px;
width: 20px;
height: 20px;
}

.creature_battle_display .r_f_type {
float: right;
margin-right: 120px;
width: 20px;
height: 20px;
}

.creature_battle_display .l_f_type {
float: left;
margin-left: 80px;
width: 20px;
height: 20px;
}


.creature_battle_display .creature_holder_r h4 {
background-color: #22212a;
background:      rgba(7,16,40,0.7);
}

.creature_battle_display .creature_holder_l h4 {
background-color: #391111;
background:      rgba(57,17,17,0.7);
}

.creature_battle_display .creature_holder_r h4 a:hover,
.creature_battle_display .creature_holder_l h4 a:hover {
opacity:         .50;
}

.creature_battle_display p,
.creature_battle_display p {
margin:         0px; 
font-size:      14px;
clear:          both;
}

.creature_battle_display .creature_holder_r {
float:          left;
}

.creature_battle_display .creature_holder_l {
float:          right;
}

.creature_battle_display  .battle_formation_l {
float:          right;
margin:         60px 30px 0 0;
}

.creature_battle_display  .battle_formation_r {
float:          left;
margin:         60px 0 0 30px;
}

.creature_battle_display .creature_holder_r .creature_image,
.creature_battle_display .creature_holder_l .creature_image {
font-size:      14px;
width:          100px; 
height:         100px;
border-radius:  10px;
}

.creature_battle_display  .creature_image:hover,
.creature_battle_display .creature_image:hover {
-webkit-transition: background-color 1s ease-in;
transition:    background-color 1s ease-in;
}

.creature_battle_display .creature_holder_r .creature_image:hover {
background-color:  #111c39;
}

.creature_battle_display .creature_holder_l .creature_image:hover {
background-color: #391111;
}

.creature_holder_r .creature_image,
.creature_holder_r .creature_image .top_creature_messages, 
.creature_holder_r .creature_image .bottom_creature_messages, 
.creature_holder_r .battle_ability_display,
.creature_holder_r .ep_damage_display, 
.creature_holder_r .hp_damage_display,
.creature_holder_r .shrinking_debuff,
.creature_holder_r .growing_buff,
.creature_holder_r .shrinking_sickness,
.creature_holder_r .growing_sickness,
.creature_holder_r .item_gain,
.creature_holder_r .egg_gain,
.creature_holder_r .message_display,
.spr_switch {
transform: scaleX(-1);
-webkit-transform: scaleX(-1);
}


.creature_battle_display .creature_holder_r .energy_display,
.creature_battle_display .creature_holder_l .energy_display {
border:           black solid 1px;
border-radius:    5px;
padding:          2px;
}

.creature_battle_display .energy_display_r p {
background-color: #22212a;
background:      rgba(7,16,40,0.7);
text-align:      left;
border: black     solid 1px;
border-radius:    5px;
padding-left:     5px;
}

.creature_battle_display .energy_display_l p {
background-color: #391111;
background:      rgba(57,17,17,0.7);
text-align:      right;
border: black     solid 1px;
border-radius:    5px;
padding-right:     5px;
}

.creature_battle_display .bottom_creature_messages img,
.creature_battle_display .bottom_creature_messages img {
width:             20px;
height:            20px;
z-index:           20;
}

.creature_battle_display .bottom_creature_messages .affliction_r {
float:          left;
}

.creature_battle_display .bottom_creature_messages .affliction_l {
float:          right;
}

.creature_battle_display .bottom_creature_messages .affliction_r img, 
.creature_battle_display .bottom_creature_messages .affliction_l img {
margin-bottom: -6px;
}

#guest_wrap {
margin: 0 0 0 38px;
}

.battle_options {
position:           absolute;
margin-top:         -54px;
height:             110px;
width:              190px;
display:            none;
padding-top:        3px;
background-repeat: no-repeat;
padding-left:       5px;
border:            black dotted 2px;
background-color:   #22212a;
background: rgba(34,34,42,0.90);

overflow:          auto;
}

.battle_options a {
color:             white;
border:            none;
width:             75px;
display:           block;
float:             left;
margin:            2px 2px 2px 2px;
text-decoration:   none;
font-size:         11px;
text-align:        center;
position:          relative;
z-index:           1;
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
color:             white;
text-overflow:     ellipsis;
white-space:       nowrap;
overflow:          hidden;
-o-text-overflow:  ellipsis;  
}

.battle_options a:hover {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
z-index:           101;
}

.battle_options a:visited {
color:             white;
}

.battle_options h4 {
margin:         0;
padding:        0;
font-size:      12px;
}

.battle_options h4 b {
color:          lime;
}

#battle_execute {
margin:          6px 0 10px 15px;
display:         block;
clear:           both;
height: 30px;
}

#battle_execute input {
margin:          0 0 0 105px;
}

#battle_execute #repeat {
margin: 0 0 -10px 80px;
padding: 0;
height: 30px;
width: 30px;
}

#battle_execute #execute {
margin: 0;
padding: 0;
}

#battle_execute #run {
margin: 0 0 0 105px;
padding: 0;
}


#cho_targ {
width:           150px;
text-align:      center;
padding:         3px 3px 3px 3px;
background:      #2b1f35;
border:          black solid 1px;
position:        fixed;
z-index:         20;
margin:          40px 0 0 140px;
background:      rgba(171,36,36,0.8);
border-radius:    15px;
text-decoration: blink;
display:         none;
}

#hotkey_img {
position:        absolute;
margin:          40px 0 0 570px;
}

.battle_info_bar {
height:           22px;
width:            742px;
font-size:        14px;
margin:           5px auto 5px auto;
clear:            both;
color:            white;
float:            left;
clear:            both;
padding:          0 5px 0 5px;
background:       #2b1f35;
background:       rgba(20,3,32,.9);
border-radius:    15px;
box-shadow:       4px 4px 10px black;
background-repeat: no-repeat;
}

.battle_info_bar  table {
width:           100%;
margin:          0 0 0 0;
font-size:       10px;
}

.battle_info_bar  table tr td {
min-width:       17px;
}

.battle_info_bar  img {
width:           17px;
height:          17px;
}

.battle_info_bar  table td .status_bar {
margin:          0px 0 0 0;
width:           150px;
height:          18px;
overflow:        hidden;
}

#action_text_div {
position: absolute;
z-index: 200;
width: 800px;
top: 0;
background-color: #184065;
border: black solid 2px;
padding: 20px;
}

#action_text_div #action_script_textarea {
width: 600px;
height: 400px;
margin-left: 100px;
}

#battle_message {
margin:          0 auto 14px auto;
overflow:        auto;
padding:         0px 0 0 20px;
border:          none;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
background-repeat: no-repeat;
word-wrap:   break-word;
margin-left: 3px;
z-index: 40;
resize: vertical;
background-color:   #22212a;
background: rgba(34,34,42,0.90);
border: black dotted 2px;
}

#battle_message #battle_settings {
overflow: auto;
width: auto;
background-color:      #353749;
border: black dotted 2px;
}

#battle_message #battle_settings h6 {
font-size: 14px;
float: left;
line-height: 30px;
padding: 0 5px 0 5px;
margin: 5px 5px 5px 5px;
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#battle_message #battle_settings h6:hover {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
}

#battle_message #battle_settings h6 b {
text-decoration: underline;
color: #fff08a;
}

#battle_message #battle_settings img {
float: left;
width: 30px;
margin: 5px;
border-radius: 5px;
}

#battle_message #battle_settings #modify_button {
float: right;
}

#battle_message.no_guest {
height:          200px;
width:           792px;
float:           left;
}

#battle_message.guest_present {
height:         200px;
width:          450px; 
float:          right;
}

#battle_message.message_overlay {
height:          600px;
width:           792px;
position: absolute;
margin-top: -550px;
}

#player_chat { 
margin:           0px 0px 5px 70px;
display:          block;
}

#player_chat textarea {
width:            650px;
}

/* end battle layout */

/* begin battle select layout */

.battle_ads {
width:           468px;
height:          74px;
margin:          5px auto 0 auto;
border:          2px solid black;
}

.battle_result {
width:           600px;
min-height:      20px;
margin:          10px auto 0 auto;
border:          2px solid black;
color:           white;
font-size:       14px;
text-align:      center;
background:      #000033;
}

.advert {
width:           100px;
height:          20px;
color:           white;
margin:          0 auto 0 auto;
}

.battle_select_container {
clear:                 both;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
padding: 2% 0 2% 0;
}

.battle_select_container table {
white-space:           nowrap;
margin:                0 auto 0 auto;
}

.battle_select_container table th {
background-color:   #282535;
border:             black dotted 2px;
}

.battle_select_container table td {
border:            #4e4d5e dotted 2px;
background-color:   #22212a;
text-align:            center;
}

.battle_select_container h4 {
background-color:   #282535;
border:             black dotted 2px;
margin: 5%;
padding: 2%;
border-radius: 4px;
}

#wait_box {
width: 600px;
margin: 15px auto 15px auto;
}

#wait_box img {
float:           left;
}

#wait_box #waiting {
margin:          10px 40px 0  40px;
border:          2px solid black;
}

#view_battle_table {
margin:          5px auto 5px auto;
clear:           both;
} 

#view_battle_table select {
width:           136px;
}

#view_battle_table input {
width:           136px;
}

#game_creation {
width:           450px;
min-height:      110px;
margin:          15px auto 15px auto;
padding:         10px 5px 12px 5px;
color:           white;
text-align:      center;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#game_creation table th {
font-style:            italic;
border-radius:         10px;
background-color:   #282535;
border:             black dotted 2px;
}

#game_creation table td img {
float:               left;
}

#create_notice {
width:           320px;
background:      none; 
border:          none; 
color:           white; 
text-align:      center; 
margin-top:      3px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:   20px;
font-style:      italic;
margin:          0 auto 0 auto;
}

#game_creation table {
width:           340px;
margin:          6px auto 0 auto;
}

#game_creation select {
width:           160px;
}


#game_creation table tr th input {
color:           white;
background:      black;
text-align:      center;
}

.duel_null_menu {
width:          205px;
}

/* end battle select layout */
/* begin battle general layout */

.uber_color, .Uber_color {
color: red;
}

.pocket_color, .Pocket_color {
color: yellow;
}

.superb_color, 
.Superb_color, 
.creature_holder_r h4 .Superb_color, 
.creature_holder_l h4 .Superb_color {
color: violet;
}

.great_color, 
.Great_color, 
.creature_holder_r h4 .Great_color, 
.creature_holder_l h4 .Great_color {
color: lime;
}

.good_color, 
.Good_color, 
.creature_holder_r h4 .Good_color, 
.creature_holder_l h4 .Good_color {
color: yellow;
}

.average_color, 
.Average_color, 
.creature_holder_r h4 .Average_color, 
.creature_holder_l h4 .Average_color {
color: aqua;
}

.poor_color, .Poor_color, 
.creature_holder_r h4 .Poor_color, 
.creature_holder_l h4 .Poor_color {
color: orange;
}

.flame_color {
color: white;
background-color: #783232;
}

.water_color {
color: white;
background-color: #326278;
}

.rock_color {
color: white;
background-color: #7a7266;
}

.electric_color {
color: white;
background-color: #bcbb82;
}

.shadow_color {
color: white;
background-color: #4f3d6a;
}

.sacred_color {
color: black;
background-color: #fdfdfd;
}

.ghost_color {
color: black;
background-color: #fdfdfd;
}

.wrath_color {
color: white;
background-color: #87655b;
}

.ice_color {
color: black;
background-color: #d0fcff;
}

.poison_color {
color: black;
background-color: #e4d0ff;
}

.plant_color {
color: white;
background-color: #4b6938;
}

.wind_color {
color: black;
background-color: #b1e2b1;
}

.miss_color {
color: white;
}

.critical_color {
color: yellow;
}

.enchantment_color {
color: gold;
}

.bloodstain_color {
color: red;
background-color: black;
}

.kin_color {
color: tan;
}

.hp_color {
color: lime;
}

.std_color {
color: grey;
}

.skill_color {
color: #d46ad8;
}

.attack_color {
color: #d86a6a;
}

.style_color {
color: #d86a6a;
}

.level_up_color {
color: #8bffc2;
}

.item_color {
color: yellow;
}

.level_color {
color: aqua;
}

.discipline_color {
color: #d33f55;
}

.ep_color {
color: yellow;
}

.atk_color, .color_2 {
color: red;
}

.sick_color {
color: #c1c1c1;
}

.buff_color {
color: aqua;
}

.debuff_color {
color: violet;
}

.def_color, .color_1 {
color: #3399ff;
}

.guest_color, .color_3 {
color: lime;
}

.pocket_form {
border-radius: 5px;
padding: 3px;
border: black solid 1px;
}

/* end battle general layout */

/* begin equip inventory layout*/

#key_item_notice {
width:             300px;
margin:            25px auto 25px auto;
background:        #2f194a;
border:            2px solid black;
box-shadow:        4px 4px 10px black;
border-radius:     20px;
color:             white;
text-align:        center;
padding:           3px;
}

#equip_display_box {    
min-width:         200px;
min-height:        200px;
margin:            0px 20px 15px 20px;
padding:           0px 0 20px 0;
background:        #333333;
border:            2px solid black;
}

#equip_display_box ul {
list-style:        none;
text-align:        center;
margin:            13px 0 0 0;
}

.clear_it {
clear:   both;
}

.float_right_check {
float:             right;
margin:            0 10px 0 0;
}

.outer_equip_box {
min-height:        235px;
float:             left;
margin-top: 5px;
}

.outer_equip_box .rename_button {
float:             left;
display:           block;
margin:            0 0 -5px 25px;
padding:           0 15px 0 25px;
color:             white;
z-index:           2;
font-size:         13px;      
-webkit-transition: all 1s ease;
transition:         all 1s ease;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;
background-image: url(/images/icons/buttons/edit_s.png);
background-repeat: no-repeat;

}

.outer_equip_box .rename_button:hover {
background-color:        #3e5381;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

.outer_equip_box .equip_box, .key_box, .item_box, .marble_box {
min-height:        50px;
width:             395px;
margin:            5px 0 0px 11px;
-webkit-transition: border-color 1s ease;
transition:         border-color 1s ease;
font-size:         10px;
float:             left;
z-index:           1;
background-color:      #353749;
border:       black dotted 2px;
}

.marble_box {
width:             148px;
height:            120px;
}

.outer_equip_box .equip_box {
clear:             both;
}

.outer_equip_box .equip_box p, .key_box p, .item_box .item_top_info, .marble_box p {
font-size:         12px;
height:            50px;
overflow: auto;
}

.item_box .item_bottom_info {
clear: both; 
float: right; 
margin-right: 6px;
min-height: 50px;
}

.item_bottom_info .pn_box {
width: 75px;
}

.outer_equip_box .equip_box table, .key_box table, .item_box table {
font-size:         10px;
}

.marble_box ul {
list-style: none;
}

#bloodstain_menu .bloodstained {
background-image: url("/images/bloodstains/1.png");
background-repeat: no-repeat;
border-radius: 15px;
padding: 5px;
background-position: bottom left;
}

#bloodstain_menu ul {
margin-left: 0;
padding-left: 0;
}

.outer_equip_box .equip_box h4, .key_box h4, .item_box h4, .marble_box h4 {
color:             white;
text-align:        center;
margin:            0 0 0 0;
padding:           5px 0 5px 0;
background-color:   #282535;
border:            1px dotted #233f6c;
height: 25px;
border-top: none;
border-right: none;
border-left: none;
font-size:         15px;
}

.outer_equip_box .equip_box h4 .magnifier, .key_box h4 .magnifier, 
.item_box h4 .magnifier, .marble_box h4 .magnifier {
margin-bottom: -10px;
margin-left: 5px;
width: 30px;
height: 30px;
}

.outer_equip_box .equip_box {
height:       175px;
overflow:     auto;
}

.outer_equip_box .equip_box .level_icon {
margin-top: -15px;
}

.outer_equip_box .equip_box p {
height:           auto;
}

.outer_equip_box .equip_box .eq_attributes {
height:           60px;
background-color:   #282535;
border-radius:    10px;    
margin:           5px 5px 5px 70px;
padding:          0 5px 0 5px;    
}

.outer_equip_box .equip_box .eq_special {
height:           40px;
background-color:   #282535;
border-top-right-radius:    10px;
border-top-left-radius:    10px;
margin:           0 5px 0 5px;
padding:          0 5px 0 5px;
}

.outer_equip_box .equip_box .eq_extensions {
height:           25px;
background-color:   #282535;
border-bottom-right-radius:    10px;
border-bottom-left-radius:    10px;
margin:           0 5px 0 5px;
padding:          0 5px 0 5px;
}

.outer_equip_box .equip_box .eq_extensions img {
max-width: 15px;
}

.outer_equip_box .equip_box span {
color:            white;
clear:            both;
float:            right;
}

.outer_equip_box .eq_marble {
margin-left: 28px;
clear: both;
}

.outer_equip_box .eq_marble img, .outer_equip_box .safety {
width:             30px; 
height:            30px;
background-color:   #282535;
border:            2px dotted black;
padding:           4px;
float: left;
border-bottom-right-radius:    10px;
border-bottom-left-radius:     10px;
background:      #5e6180;
background: rgba(94,97,128,0.50);
margin-top: -2px;
border-top: none;
}

.outer_equip_box .safety {
float: right;
margin-right: 15px;
}

#marble_addition_menu p, 
#equip_rename_menu p {
margin: 5px 25% 5px 25%;
padding: 5%;
background-color: #282535;
border-radius: 10px;
}

#marble_addition_menu p b, 
#equip_rename_menu p b {
color:              aqua;
}

#marble_addition_menu p input, 
#equip_rename_menu p input {
display:           inline;
}

#marble_addition_menu #marble_image, #equip_rename_menu #re_equip_image {
display:           block;
margin:            6px auto 30px auto;
clear: both;
}

#marble_addition_menu select {
margin:            0 auto 0 auto;
display: block;
}

#marble_addition_menu input, #equip_rename_menu input {
display:           block;
margin:            5px auto 3px auto;
}

.key_box {
height:       120px;
width:        257px;
overflow:     auto;
}

.key_box p {
width: 160px;
float: left;
}

.inventory_pic {
float:             left;
width:             50px;
height:            50px;
text-align:        center;
margin:            10px 10px 0 10px;
color:             white;
background-color:   #22212a;
border:        black dotted 2px;  
border-radius: 10px;
}

.equip_table {
font-size:        13px;
min-width:         270px;
margin:           0 auto 0 auto;
color:            white;
}

/* end equip setup layout */
/* begin party setup layout*/

#party_options_buttons {
color:            white;
margin:           6px auto 5px 50px;
border-radius:    5px;
padding:          5px;
width: 96%;
}

#party_options_buttons #quick_adventure {
width: 140px;
}

#party_options_buttons #create_party {
margin: 0 auto 0 70px;
}

#party_box_container {
width:              700px;
min-height:         100px;
margin:             10px auto 0px auto;
}

#quick_party_generation_box {
max-height: 400px;
overflow: auto;
}

#quick_party_generation_box table {
width: 600px;
margin: 0 auto 0 auto;
}

#quick_party_generation_box #gen_adventure_party {
display: block; 
margin: 3px auto 3px auto;
}

#party_creation_box table {
width:              200px;
height:             70px;
margin:             14px 0px 0px 0px;
}

#battle_party_member_modifier select,
#battle_party_member_modifier input,
#party_member_modifier select, 
#party_member_modifier input {
clear:              both;
display:            block;
margin:             0 auto 0 auto;
}

#party_member_modifier input,
#battle_party_member_modifier input {
margin-bottom: 10px;
}

#party_creation_box           #creation_information, 
#party_member_modifier        #replace_output,
#battle_party_member_modifier #replace_output {
margin:              8px auto 8px auto;
display:             block;
width:               90%;
max-height:          300px;
overflow:            auto;
padding:             5px;
min-height:          60px; 
border-radius:       10px;
background-color: #282535;
border: black dotted 2px;
}

#party_creation_box           #creation_information p, 
#party_member_modifier        #replace_output p,
#battle_party_member_modifier #replace_output p {
background-color: #282535;
border: none;
}

#party_creation_box           h3, 
#party_member_modifier        h3,
#battle_party_member_modifier h3 {
font-size: 20px;
}

#party_creation_box           #creation_information #gene_info, 
#party_member_modifier        #replace_output #gene_info,
#battle_party_member_modifier #replace_output #gene_info {
word-break:       break-all;
white-space: normal;
}


#party_creation_box #creation_information table th, 
#party_member_modifier #replace_output table th,
#battle_party_member_modifier #replace_output table th {
padding:   4px;
border:             none;
}

#party_creation_box #creation_information table td, 
#party_member_modifier #replace_output table td,
#battle_party_member_modifier #replace_output table td {
padding:   4px;
border:            #4e4d5e dotted 3px;
background-color:  #5e5d70;
}

#party_creation_box #creation_information table td, 
#party_member_modifier #replace_output table td,
#battle_party_member_modifier #replace_output table td {
border:            #4e4d5e dotted 3px;
background-color:   #5e5d70;
}

#party_creation_box #creation_information, 
#battle_party_member_modifier #replace_output, 
#party_member_modifier #replace_output {
 
}

#party_creation_box #creation_information table,
#battle_party_member_modifier #replace_output table, 
#party_member_modifier #replace_output table {
white-space:       nowrap;
width:             100%;
float: left;
}

#party_creation_box #creation_information table.limited,
#battle_party_member_modifier #replace_output table.limited,
#party_member_modifier #replace_output table.limited {
width: 70%;
}

#party_creation_box #creation_information #creature_info_img, 
#battle_party_member_modifier #replace_output #creature_info_img,
#party_member_modifier #replace_output #creature_info_img {
float: left;
width: 30%
}

.party_container {
float:               left;
width:               400px;
margin:              5px 0 5px 10px;
}

.party_container .creature_party {
width:               364px;
height:              276px;
margin:              0px auto 0 auto;
padding:             8px 5px 8px 5px;
border-radius:       15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;
}

.party_container .creature_party .creature_box {
width:            100px;
height:           160px;
float:            left;
margin:           5px 0 0 16px;
text-align:       center;
font-size:        13px;
}

.party_container .creature_party .creature_box .party_level {
margin-top: 0px;
margin-bottom: -6px;
border: none;
width: 20px;
background: none;
}

.party_container .creature_party .creature_box h6 {
margin:             4px 0 4px 0;
font-size:          15px;
white-space:        nowrap;
overflow:           hidden;
text-overflow:      ellipsis;
}

.party_container .creature_party .creature_box img {
background:          #111c39;
border:              black solid 2px;
border-radius:       10px;
margin:              0 0 5px 0;
background-color:   #282535;
border:             black dotted 2px;
}

.party_container .creature_party .creature_box .arrow_switch_r,
.party_container .creature_party .creature_box .arrow_switch_l {
background: none;
border: none;
}

.party_container .creature_party .creature_box .arrow_switch_r {
float: right;
}

.party_container .creature_party .creature_box .arrow_switch_l {
float: left;
}


.party_data {
width:               360px;
min-height:          48px;
color:               black;
margin:              0 0 0 0px;
color:               white;
}

.party_data img {
float:               left;
}

.party_data h5, .party_data h6 {
margin:             0px  12px 0 12px;
font-weight:        bold;
font-size:          18px;
float:               left;
padding:             3px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:       10px;
width:               250px;
text-align:          center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.party_data h6 {
font-size:          13px;
margin-top:         20px;
width:               245px;
}

.party_data h3 {
margin: 0;
}

.party_data h6 b {
margin:             0 5px 0 5px;
}


.creature_party .adventure_container {
clear:      both;
margin:     -10px 0 0 0;
height:     30px;
padding:    0;
position: relative;
}

.creature_party .adventure_container p {
margin: 0 0 0 0;
padding: 5px;
background:          #111c39;
border:              black solid 2px;
border-radius: 5px;
}

.creature_party .adventure_container .adv_repeat {
position: absolute;
margin: -36px 0 0 70px;
width: 35px;
}

.creature_party .adventure_container img {
display:    block;
margin:     auto;
border:     none;
}

.creature_party .adventure_container a img {
border:     none;
}

.creature_party .adventure_container .wait_message {
position: absolute;
width:    300px;
z-index:  19;
top: 0;
right: 0;
margin:    80px 25px 0 0;
background-color: black;
border-radius: 10px;
padding: 5px;
background: rgba(0,0,0,0.8);
}

/* end of party setup layout*/

/* Begin Test Layout */

#testing_page {
width:      750px;
background: rgba(26,29,85,0.5);
border:     #0b0d35 solid 2px;
margin:     15px auto 15px auto;
border-radius: 15px;
padding:    0;
}

#testing_page h4 {
width:      635px;
border:    #132b54 solid 2px;
border-radius: 15px;
background: #111c39;
text-align: center;
padding: 5px 0 5px 0px;
margin: 15px auto 15px auto;
font-size: 20px;
}

#testing_page ol {
width:      600px;
margin:     0 auto 0 auto;
padding: 35px;
line-height: 25px;
color: #d7e0f1;
background: #111c39;
border:    #132b54 solid 2px;
border-radius: 15px;
}

#testing_page ol li ul {
margin:           0px;
padding:          0px;
list-style:       none;
}

#testing_page ol li ul li {
background-image: none;
list-style: none;
}

#testing_page span input {
margin: 10px auto 10px auto;
display: block;

}

/* End Test Layout */

/* begin Overlay layout */

#darkness, #dark_convo {
width:       876px;
height:      100%;
margin-top: 0px;
position:    absolute;
z-index:     100;
background:   rgba(0,0,0,0.8);
}

#darkness div, #dark_convo div {
color:             white;
width:             814px;
min-height:        80px;
padding:           0 10px 0 0px;
margin:            15px 15px 0px 25px;
position:          absolute;
overflow:          auto;
background-color:  #353749;
border: black dotted 2px;
}

/* Begin Conversation Layout */

#dark_convo #close_conversation {
float: right;
margin: 1%;
width: 5%;
}

#dark_convo #inner_convo {
height: 450px;
overflow: hidden;
}

#dark_convo #inner_convo #title_display {
-webkit-transition: color 1s ease;
transition:         color 1s ease;
font-size: 70px;
margin-top: 120px;
right: -50%;
position: absolute;
z-index: 18;
border: none;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
background-color:   #282535;
border:             black dotted 4px;
box-shadow:        4px 4px 10px black;
padding: 10px;
text-align: center;
border-radius:15px;
width: 94%;
}

#dark_convo #inner_convo #background_div {
position: absolute;
z-index: 10;
width: 760px;
margin-top: 80px;
height: 250px;
background-size: cover;
border: black dotted 2px;
border-radius: 15px;
box-shadow:       5px 5px 10px black;
background-repeat: no-repeat;
}


#dark_convo #inner_convo #codec_div {
position: absolute;
z-index: 10;
width: 760px;
margin-top: 80px;
height: 350px;
background-size: cover;
border: none;
box-shadow:       5px 5px 10px black;
background-repeat: no-repeat;
background-size: contain;
background-color: black;
}

#dark_convo #inner_convo .codec_avatar {
opacity: .65;
width: 110px;
height: 110px;
position: absolute;
margin-top: 40px;
border: none;
background-color: transparent;
}

#dark_convo #inner_convo .codec_avatar#left_codec_avatar {
margin-left: 23px;
}

#dark_convo #inner_convo .codec_avatar#right_codec_avatar {
margin-left: 640px;
}

#dark_convo #inner_convo #codec_div #codec_text {
color: #ddb4e7;
margin: 200px 0px 0 20px;
}

#dark_convo #inner_convo #codec_div #codec_text b {
color: #a3a9fa;
margin-right: 5px;
}


#dark_convo #inner_convo #message_window {
background-color: transparent;
background-size: cover;
color: black;
margin-top: 240px;
width: 650px;
height: 200px;
position: absolute;
left: 50px;
z-index: 15;
border: none;
overflow: hidden;
}

#dark_convo #inner_convo #message_window a {
color: #1a2c45;
}

#dark_convo #inner_convo #message_window a:visited, 
#dark_convo #inner_convo #message_window a:active,
#dark_convo #inner_convo #message_window a:focus {
color: #3b5375;
}

#dark_convo #inner_convo #next_button, 
#dark_convo #inner_convo #battle_button {
background: transparent;
width: 50px; 
height: 70px;
position: absolute;
z-index: 16;
right: 0;
bottom: 0;
margin-right: 125px;
margin-bottom: 40px;
border: none;
overflow: hidden;
}


#dark_convo #inner_convo #next_button h4, 
#dark_convo #inner_convo #battle_button h4 {
background-size: cover;
background-repeat: no-repeat;
background-position: center;
text-align: center;
line-height: 50px;
width: 100%;
font-family: 'october crow';
font-size: 20px;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
}

#dark_convo #inner_convo #next_button:hover,
#dark_convo #inner_convo #battle_button:hover {
opacity: .50;
}

#dark_convo #inner_convo #message_window #c_avatar {
margin-left: 8%;
top: 25%;
width: 75px;
height: 75px;
border: black dotted 2px;
display: block;
position: absolute;
background-color: #614c79;
}

#dark_convo #inner_convo #message_window #c_message {
height: 60%;
width: 70%;
margin-left: 25%;
margin-top: 6.5%;
}

#dark_convo #inner_convo .left_images, 
#dark_convo #inner_convo .right_images {
position: absolute;
z-index: 11;
height: 280px;
margin-top: 50px;
}

#dark_convo #inner_convo .left_images {
left: -50%;
}

#dark_convo #inner_convo .right_images {
right: -50%;
transform:          scaleX(-1); 
-webkit-transform:  scaleX(-1);
}

#dark_convo #choice_box {
background-color: transparent;
margin-left: 75px;
margin-top: 470px;
width: 700px;
height: auto;
position: absolute;
z-index: 16;
border: none;
overflow: auto;
max-height: 500px;
}

#dark_convo #choice_box h4 {
margin: 0 0 0 0;
}

#dark_convo #choice_box .choice {
width: auto;
height: auto;
border:             lime dotted 2px;
border-radius: 15px;
color: white;
padding: 10px 10px 10px 30px;
margin: 5px 0 5px 0;
background:         url(../images/icons/comparisons/g-greater.gif) no-repeat left;
background-color:   #282535;
}

#dark_convo #choice_box .choice:hover {
opacity: .50;
}


/* begin tutor layout */

#darkness div .icon {
width: 30px; margin-bottom: -10px;
}

#darkness div #close {
width: 50px;
}

#darkness.absolute_darkness {
background:   rgba(0,0,0,1); 
margin-top: -10px;
width: 100%; 
height: 110%;
position:fixed
}

.tutorial_hint {
position:    absolute;
z-index:     20;
background:   black;
background:   rgba(0,0,0,0.8);
width:       100px;
color:       white;
border-radius: 15px;
padding:       15px;
/* pointer-events:   none; */
}

.tutorial_hint .hint_arrow {
position: absolute;
margin: -30px 0 0 -20px;
}

.tutorial_hint .close {
float: right;
margin: -30px -20px 0 0;
}

#darkness div #disable_tutorial {
float:       right;
margin:      5px;
margin-right: 20px;
clear:       both;
border:      red solid 1px;
background:  #151515;
}

#darkness #close {
float:            right;
margin:           10px 5px 5px 5px;
}

#darkness div img {
margin: 10px;
}

#darkness div h4 {
margin:           10px 5px 0 5px;
padding:          0 0 0 0;
font-size:        15px;
text-align:       center;
background:       transparent;
border-radius:    10px;
border-bottom:    0px;
}

#darkness div h3 {
margin:           10px 5px 0 25px;
font-size:        19px;
border:           black solid 2px; 
padding:          5px;
width:            350px;
text-align:       left;
background:       #0d1d3f;
border-radius:    10px;
clear:            both;
box-shadow:       5px 5px 10px black;
}


#darkness div .avatar, 
#darkness div .avatar_r, 
#darkness div .avatar_l,
#darkness div .spr {
margin:           15px 15px 15px 4px;
float:            left;
background-color: #22212a;
border-radius:    10px;
}

#darkness div h6 {
text-align: center; 
background: black; 
padding: 5px; 
font-size: 15px; 
margin: 0;
}

#darkness div .spr {
background: transparent;
float: none;
}

#darkness div .avatar_r {
float: right;
}

#darkness div .avatar_l {
float: left;
}

#darkness div p {
margin:           5px 0 0 10px;
padding:          5px 5px 5px 5px;
border-radius:    10px;
}

#tutorial_disable {
float:            right;
font-size:        9px;
background:       #333333 url(../images/gradients/10.png);
padding:          5px 5px 5px 5px;
margin:           2px 2px 2px 2px;
border-radius:    10px;
border:           2px solid black;
}

#darkness div ul, #darkness div ol {
clear: both;
}

#darkness div ul li, #darkness div p {
overflow: auto;
}

#close_button, #close {
border: none;
float: right;
}

#log_button {
float: left;
}

#important_notice {
color:            white;
padding:          10px;
margin:           10px 15px 10px 15px;
border-radius:    10px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#important_notice #close_button {
width: 50px;
height: 50px;
 background-size: 50px 50px;
background-repeat: no-repeat;
text-align: center;
padding-top: 10px;
font-size: 24px;
}

#important_notice h3 {
font-size:        20px;
margin:           10px 0 10px 0;
text-align:       center;
}

#important_notice p, #darkness div p {
margin:           5px;
padding:          10px;
background-color:   #2f2d3f;
border:             black dotted 2px;
}

#important_notice ul li, #important_notice p {
clear: both;
overflow: auto;
}


#important_notice .backdrop {
background:       #22212a;
border-radius: 5px;
margin: 0 -10px 0 -10px;
}

#important_notice .promotion-info {
display: none;
}

#important_notice .notice_image {
opacity: 1;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

#important_notice .notice_image:hover {
opacity: .50;
}

#important_notice .left_icon {
float: left;
width: 50px;
margin-right: 5px;
}

#important_notice .preorder_reward {
margin: 15px 5px 5px 5px;
color: pink;
float: left;
font-size: 21px;
}

#important_notice .monthly_event {
float:            left;
}

#important_notice ul {
list-style:       none;
}

#important_notice ul li, #darkness div ul li, #darkness div ol li {
margin:           10px 0 10px 0;
border-radius:    15px;
padding:          7px;
background-color:   #282535;
border:             black dotted 2px;
}

#important_notice ul ul ul {
margin:           0;
border-radius:    15px;
list-style-image: url(../images/icons/completed.png);
background-color: #112250;
}

#important_notice ul li ul li, #darkness div ol li ol li {
border:           none;
background-color: transparent;
}

#darkness div #next_tutorial {
width: 125px;
height: auto;
max-width: none;
min-width: 0;
max-height: none;
min-height: 0;
overflow: none;
padding: 0px 0px 0 0;
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
float: right;
position:              relative;
clear: both;
margin-bottom: 20px;
opacity: 1;
-webkit-transition: opacity 1s linear;
transition:    opacity 1s linear;
}

#darkness div #next_tutorial:hover {
opacity: .50;
-webkit-transition: opacity 1s linear;
transition:    opacity 1s linear;
} 

#darkness div #next_tutorial span {
width: 60px;
text-align: center;
font-size: 100%;
float: left;
margin: 0;
padding: 0;
}

#darkness div #next_tutorial #moving_arrow {
float: right;
height: 30px;
margin: 5px 10px 0 0;
padding: 0;
animation-name: move_tutorial_arrow;
animation-duration: 2s;
animation-iteration-count: infinite;
}

@keyframes move_tutorial_arrow {
    0%   {margin-right: 10px;}
    50%  {margin-right: 0px; }
    100% {margin-right: 10px;}
}


#tutor_category {
width:                400px;
margin:               -60px 0 0 370px;
padding:              10px 15px 10px 15px;
position:              relative;
z-index:               1;
border-radius:         10px;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#tutor_category .sp_link {
float:                 left;
width:                 175px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:         10px;
text-align:            center;
text-decoration:       none;
margin:                10px;
}

#tutor_category .sp_link:hover {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#tutor_category .sp_link a {
font-size:             15px;
margin:                 0;
}


#display_lesson {
width:                760px;
min-height:           60px;
position:              relative;
z-index:               1;
margin:               10px auto 0 auto;
padding:              8px 8px 8px 8px;
color:                 white;
background-color:      #353749;
border: black dotted 2px;
}

#display_lesson .pocket_nightmare_list, #display_lesson .enemy_list {
border: black dotted 4px; 
background-color: #3f2b56; 
padding-bottom: 10px; 
padding-top: 10px;
}

#display_lesson .enemy_list {
background-color: #163316;
}

#tutor_category .tutorial_return_link, 
#display_lesson .tutorial_return_link  {
margin:                10px auto 10px auto;
text-align:            center;
text-decoration:       none;
clear:                 both;
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
display: block;
}

.tutorial_return_link a {
background: url('/images/icons/return.png') no-repeat;
background-size: 25px 25px;
padding-right: 30px;
background-position: right; 
}

#display_lesson iframe {
width:                650px;
height:               300px;
border:               none;
}

#display_lesson .tutorial_avatar {
margin: 5px; 
width: 40px; 
height: 40px;
}

#display_lesson table {
}

#display_lesson table h4 {
margin: 0 auto 0 auto;
}

#display_lesson table .shrink img {
width:  90px;
height: 90px;
}

#display_lesson table tr th p, #display_lesson table tr td p {
word-wrap:        break-word;
}

#display_lesson table tr th, #intro_box table tr th, #challenge_display table tr th {
background-color:   #282535;
border:             black dotted 2px;
}

#display_lesson table tr td, #intro_box table tr td, #challenge_display table tr td  {
border:            #4e4d5e dotted 3px;
background-color:   #22212a;
padding: 5px;
}

#display_lesson table tr td img  {
margin:               0 auto 0 auto;
}

#display_lesson .learn {
box-shadow:        5px 5px 10px black;
border:            1px solid black;
}

#display_lesson ul {
background-color:   #282535;
border:             black dotted 2px;
padding-bottom: 10px;
padding-top: 10px;
}

#display_lesson ul ul {
background-color: #353749;
}

#display_lesson ul ul ul {
background-color:   #282535;
}



#display_lesson p {
margin:             10px 10px 10px 10px;
background-color:   #2f2d3f;
border:             black dotted 2px;
padding: 5px;
}

#tutor_category h4 {
display:               block;
margin:                10px 30px 10px 30px;
text-align:            center;
border-radius:         10px;
color:                 white;
background-color:   #282535;
border:             black dotted 2px;
}

#display_lesson h3 {
margin:                5px 20px 5px 20px;
text-align:            center;
color:                 white;
margin:                0 5px 0 5px;
font-size:             24px;
background-color:   #282535;
border:             black dotted 2px;
}

#tutor_category h4, #display_lesson h4 {
font-size:        22px;
padding:          0 15px 0 15px;
text-align:       center;
min-width:        200px;
margin:           20px 20px 20px 20px;
background-color:   #282535;
border:             black dotted 2px;
}

#display_lesson h5 {
background-color:   #282535;
border:             black dotted 2px;
font-size: 18px;
padding:          0 20px 0 15px;
text-align:       center;
min-width:        200px;
margin:           20px 40px 20px 40px;
color: white;
}

#display_lesson .lesp_promo {
float: left;
}

#display_lesson .growth_attr, #display_lesson .key_item {
width: 30px;
height: 30px;
}

#display_lesson .diff_image {
width: 200px; 
}

#display_lesson #cat_info_list li span {
color: yellow;
}

#display_lesson #cat_info_list li {
list-style: square;
}

#display_lesson #cat_info_list li b {
font-size: 25px;
}
 

/* end tutor layout */
/* Begin NPC Talk layout*/

#story-npc-talk {
width:              824px;
min-height:         150px;
padding:            10px 0 0px 0;
margin:             0px auto 0px auto;
color:              white;
border:             3px dotted black;
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
background-image: url("/images/main/puppet-silhouette.png");
background-color: #402f44;
}

#story-npc-talk div {
color:                white;
border-bottom-right-radius: 15px;
background-color:   #282535;
width:                770px;
min-height:           100px;
float:                left;
color:                white;
margin:               9px 0 0 26px;
float:                left;
border-top-left-radius: 15px;
border:             2px dotted black;
border-top: none;
}

#story-npc-talk .story {
width:              94%;
margin:             10px auto 10px auto;
background-color:   #111c39;
border-radius:      10px;
padding:            10px;
border:             black solid 2px;
clear:              both;
}

#story-npc-talk .story_image {
border:               black solid 2px;
border-radius: 15px;
box-shadow: 6px 6px 20px black;
}

#story-npc-talk .st_item_l {
max-width: 40px;
}

#story-npc-talk .story_pad {
padding-top: 6px;
border: none; 
background: none;
box-shadow: none;
}

#story-npc-talk .slab_image {
border:               black dotted 2px;
border-radius: 15px;
box-shadow: 6px 6px 20px black;
margin: 0 auto 6px auto;
display: block;
}


#story-npc-talk .story-area {
border-radius:      20px;
margin:             0 auto 0 auto;
display:            block;
box-shadow:         1px 1px 10px black;
}

#story-npc-talk div h4 {
background:           #353749;
text-align:           center;
padding:              2px 0 2px 0;
margin:               0;
border: black dotted 3px;
border-bottom-right-radius: 50px;
border-top-left-radius: 25px;
}

#story-npc-talk .story {
}

#story-npc-talk h3 {
width:              700px;
text-align:         center;
margin:             10px auto 10px auto;
}


#story-npc-talk div img {
float:                left;
}

#story-npc-talk div p img {
float:                none;
}

#story-npc-talk div p .sp_speak {
font-weight: normal;
color: aqua;
}

#story-npc-talk div .player_spirit {
width:             100px; 
height:            100px;
margin:             0 0 0 0;
background-repeat: no-repeat;
float: left;
}

div .st_item {
width:                50px;
height:               50px;
margin:               6px 12px 6px 6px;
float:                left;
border:               none;
}

#story-npc-talk div p {
margin:             0 0 0 110px;
padding:            5px 5px 0 5px;
}

#story-npc-talk .sm_speech {
width:                375px;
}

#story-npc-talk div a {
border:               none;
line-height:          25px;
display:              block;
width:              15%;
white-space:        nowrap;
padding:            0px 0 0px 35px;
background:         url(../images/icons/comparisons/g-greater.gif) no-repeat left;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
clear:              none;
text-align:         left;
margin:             0 0 0 0px;

}

#story-npc-talk div .normalize_link {
padding:            0;
clear:              none;
text-align:         left;
background-image: none;
margin:             0;
background: none;
display: inline;
text-decoration:    underline;
}

#story-npc-talk #disable_quest_link {
float:        left;
border:       none;
}

#story-npc-talk div .defloat {
float: none; 
margin: 3px;
}

#story-npc-talk div select {
margin-left:       10px;
}

#story-npc-talk div  ul {
margin:             10px 0 10px 90px;
padding-right:      5px;
list-style:         none;
}

#story-npc-talk div  ul li {
background:         url(../images/icons/pending.png) no-repeat center left; 
padding-top:        2px;  
padding-bottom:     2px;    
padding-left:       30px;
}


/* End NPC Talk Layout*/
/* Begin NPC General Layout*/

.underline_me {
text-decoration: underline;
color: tan;
}

#npc_box {
width:              500px;
height:             500px;
margin:             70px 20px 10px 50px;
border-radius:      15px;
border:             3px solid black;
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: cover;
}

#npc_box .shop_speech_box, .breeding_talk {
position:           absolute;
margin:             -60px 0 0 -30px;
width:               375px;
color:                white;
border-bottom-right-radius: 15px;
min-height:           100px;
float:                left;
color:                white;
border-top-left-radius: 15px;
background:           #282535;
border: black dotted 3px;
}

#breeding_result {
width: 500px;
z-index: 3;
margin-top: 25px;
margin-left: 110px;
position: absolute;
background-color:      #353749;
border:            #4e4d5e dotted 6px;
z-index: 3;
color: white;
box-shadow:           5px 5px 10px black;
}

#breeding_result .close {
height: 50px;
width: 50px;
}

#breeding_result p {
background-color:   #282535;
border:             black dotted 2px;
margin: 5px;
padding:5px;
}

#breeding_result .egg_icon {
width: 30px;
}

#npc_box .shop_speech_box .float_icon {
width: 30px; 
height: 30px; 
}

#npc_box  #grow_me #sp_close_button {
float: right;
}

#npc_box .shop_speech_box#build_reward_display {
margin:    80px 0 0 -20px; 
z-index:   20;
}

#npc_box .shop_speech_box#build_reward_display .close {
width: 30px;
height: 30px;
float: right;
}


#npc_box .shop_speech_box a {
border:               none;
padding:              5px 0 0 0;
margin:               0 0 0 0;
background:           none;
text-decoration:      none;
line-height:          25px;
}

#npc_box .shop_speech_box img {
border:               none;
}

#npc_box .shop_speech_box h3 {
font-size:            14px;
display:              inline;
padding:              0 3px 0 3px;
}

#npc_box .shop_speech_box p, .breeding_talk p {
padding:              0 0 0 0;
margin:               0 5px 0 115px;
}

#npc_box  .shop_speech_box #shop_restock_notice {
background-color: #501414;
clear: both;
margin: 0 0 0 0;
text-align: center;
border-bottom-right-radius: 15px;
}

.shop_speech_box #shop_restock_notice b {
color: lime;
}

#npc_box .shop_speech_box h4, .breeding_talk h4 {
text-align:           center;
padding:              2px 0 2px 0;
margin:               0;
border-bottom-right-radius: 50px;
border-top-left-radius: 25px;
background-color:   #353749;
border-bottom:        3px dotted black;
border-right:         3px dotted black;
}

#npc_box .shop_speech_box h4 i a, #npc_box .shop_speech_box h3 i a  {
color: #d4eefc;
transition:            all 1s ease;
border:            #4e4d5e dotted 4px;
border-right: none;
padding: 0 10px 0 17px;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
background-color:  #22212a;
float: right;
margin: -2px -2px 0 0px;
display: inline;
height: 32px;
line-height: 30px;
font-size: 18px;
}

#npc_box .shop_speech_box h4 i a {
background: url(/images/icons/eating.png) left no-repeat;
background-size: 20%;
border-bottom-left-radius: 20px;
border-top: none;
border-bottom: none;
}

#npc_box .shop_speech_box h3 i a {
font-size: 13px;
height: auto;
background: url(/images/icons/return.png) left no-repeat;
background-size: 30%;
border-top-left-radius: 20px;
border-top: 0px;
border-bottom: 0;
}

#npc_box .shop_speech_box h4 i a:hover, 
#npc_box .shop_speech_box h3 i a:hover {
color: #58a5ce;
transition:            all 1s ease;
border-color: #58a5ce;
}


#npc_box .shop_speech_box img, .breeding_talk img {
float:                left;
}

#npc_box  .merchandise, #npc_box .shop_stock {
width:               395px;
min-height:          10px;
position:            absolute;
padding:             0px 0px 0px 0px;
margin:              -65px 0 0 375px;
color:               white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box .shop_stock#egg_paint_stock img,
#npc_box .shop_stock#egg_shop_stock img,
#npc_box .primary_product_display#egg_shop_primary #product_img {
transform:          scaleX(-1); 
-webkit-transform:  scaleX(-1);
}

#npc_box  .merchandise p, #npc_box .shop_stock p {
color:           red;
text-align:      center;
margin-left:     -5px;
padding:         5px;
}

#npc_box  .merchandise h3, #npc_box .shop_stock h3 {  
width:                385px;
margin:               5px auto 5px auto;
color:                white; 
text-align:           center;
font-size:            14px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:        15px;
}

#npc_box  .shop_stock #buy_credit_button img {
width: 100px;
height: 100px;
margin-left: 15px;
margin-right: 14px;
float: left;
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
}

#npc_box  .shop_stock #buy_credit_button img:hover {
opacity:.50;
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
}

#npc_box #others_rewards_button {
width: 200px;
margin-left: 30px;
}

#npc_box #previous_tracked_rewards_div {
position: absolute;
z-index: 30;
color: white;
width: 700px;
margin: 0 0 0 0;
padding: 15px;
border-radius: 20px;
max-height: 600px;
overflow: auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box #previous_tracked_rewards_div ul {
list-style: none;
padding: 0;
margin: 0 auto 0 auto;
}

#npc_box #previous_tracked_rewards_div ul li {
margin: 5px 0 5px 0;
padding: 5px;
border-radius: 5px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box #previous_tracked_rewards_div ul li .reward_icon {
width: 30px;
}

#npc_box  #suggestion_listing, #npc_box #suggestion_posting, #npc_box  #suggestion_display {
width:               395px;
min-height:          10px;
position:            absolute;
padding:             0px 0px 0px 0px;
margin:              -65px 0 0 375px;
color:               white;
border-radius:       15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box #suggestion_posting {
width:              765px;
margin:              -65px 0 0 0px;
}

#npc_box  #suggestion_listing h3, #npc_box #suggestion_display h3 {
width:                385px;
margin:               5px 0 5px 0px;
color:                white;
text-align:           center;
}

#suggestion_display h2 {
font-size: 18px;
}

#npc_box  #suggestion_listing ul, #npc_box #suggestion_posting ul {
list-style: none;
}

#npc_box  #suggestion_listing ul li {
line-height: 30px;
}

 #npc_box #suggestion_posting ul li {
line-height: 40px;
}

#npc_box  #suggestion_listing ul li a {
display: block;
height: 30px;
margin: 5px 0 5px 0;
width: 260px;
}

#npc_box  #suggestion_listing ul li .image_pn_box {
display: block;
height: 40px;
margin: 5px 0 5px 0;
width: 314px;
text-align: left;
}

#npc_box #suggestion_listing .nav {
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
margin-bottom:     5px;
}

#npc_box #suggestion_listing .nav:hover {
opacity: .50;
-webkit-transition: opacity 1s ease;
transition:         opacity 1s ease;
}

#npc_box #suggestion_listing  ul #prev,
#npc_box #suggestion_listing  ul #next
{
width: 144px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
color: white;
margin: 5px 0 5px 0;
width: 120px;
}

#npc_box #suggestion_listing #next {
float: right;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
padding-right: 5px;
}

#npc_box #suggestion_listing #prev {
float: left;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
padding-left: 5px;
}

#npc_box #suggestion_listing  ul #prev:hover,
#npc_box #suggestion_listing  ul #next:hover {
border:            #4e4d5e dotted 3px;
background-color:   #5e5d70;
}

#npc_box #suggestion_listing  ul #prev a,
#npc_box #suggestion_listing  ul #next a {
padding: 0;
text-decoration: none;
color: white;
 text-align: center;
width: 120px;
}

#npc_box #suggestion_posting h2 {
text-align:           center;
}

#npc_box #suggestion_posting table {
width: 700px;
margin: 0 auto 0 auto;
}

#npc_box #suggestion_posting table  th {
text-align: left;
}

#npc_box #suggestion_posting #header {
width: 708px;
}

#npc_box #suggestion_posting #body {
width: 700px;
height: 165px;
}


#npc_box #suggestion_display {
width:               385px;
min-height:          150px;
margin:              -65px 0 0 -30px;
padding-left:       0px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box #suggestion_display #option_container {
background-color:   #282535;
border: black dotted 2px;
padding: 10px 0 0 10px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
height: 40px;
}

#npc_box #suggestion_display #option_container img {
width: 30px;
}

#npc_box #suggestion_display #option_container .vote_option {
background-color: transparent;
border: none;
width: 25px;
}

#npc_box #suggestion_display #option_container #vote_updater {
float: left;
width: 140px;
}

#npc_box #suggestion_display #staff_options  {
background-color: #2f2d3f;
padding: 10px 0 0 10px;
height: 40px;
border: black dotted 2px;
}

#npc_box #suggestion_display #option_container img:hover {
opacity: .50;
}

#npc_box #suggestion_display #option_container .pn_box_link {
float: right;
margin-right: 10px;
}

#npc_box #suggestion_display h2 {
margin-left: 5px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box #suggestion_display h3 {
width:            360px;
text-align:        left;
padding-left:      10px;
margin-left:        5px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box #suggestion_display p {
width:            350px;
display:          block;
max-height:       400px;  
overflow:         auto; 
margin-left:        5px;
background-color: #22212a;
padding:          10px;
background-color:   #2f2d3f;
border:             black dotted 2px;
}

#npc_box #suggestion_display span {
margin-left: 10px;
font-style: italic;
}

#npc_box .shop_stock .shop_selection  {
float:                left;
width:                50px;
height:               100px;
margin:               4px 5px 4px 5px;
padding:              0 2px 0 2px;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
height:               auto;
}

#npc_box .shop_stock .shop_selection:hover {
opacity:            .50;
}

#npc_box .shop_stock .shop_selection a {
text-decoration:     none;
color:               white;
text-align: center;
}

#npc_box .shop_stock .shop_selection img {
width:                45px;
height:               45px;
padding:              0 5px 0 5px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .shop_stock .shop_selection p {
font-size:            12px;
margin:               2px 0 0 0;
padding:              2px;
width:                50px;
overflow:             hidden;
overflow:             hidden;
text-overflow:        ellipsis;
height:               33px;
color:               white;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .merchandise img {
width:                49px;
height:               49px;
display:              block;
float:                left;
margin:               2px 2px 2px 2px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box  .merchandise div {
width:                50px;
height:               50px;
display:              block;
float:                left;
margin:               2px 2px 2px 2px;
border:               1px solid black;
background:           #330066 
}

#npc_box  .primary_product_display {
width:                400px;
min-height:           100px;
margin:               180px 0 0 -40px;
position:             absolute;
border-radius:        15px;
color:                white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box .primary_product_display#merc_shop_primary,
#npc_box .primary_product_display#cr_shop_primary,
#npc_box .primary_product_display#grinder_shop_primary,
#npc_box .primary_product_display#build_shop_primary,
#npc_box .primary_product_display#auction_primary {
 margin-top: 76px;
}

#npc_box .primary_product_display#custom_shop_primary_display {
margin-top: 50px; 
max-height: 400px; 
overflow: auto;
}

#npc_box .primary_product_display#eq_shop_primary {
margin-top: 100px;
}

#npc_box .primary_product_displa#alchemy_primary,
#npc_box .primary_product_display#gym_shop_primary,
#npc_box .primary_product_display#breed_shop_primary {
margin-top: 80px;
}

#npc_box #training_information ul {
width: 150px;
float: right;
}

#npc_box #training_button {
margin: 10px;
}

#npc_box .secondary_product_display#gym_secondary_product_display {
margin-top:  300px;
margin-left: 374px;
width: 390px;
}

#npc_box .secondary_product_display#gene_lab_secondary {
margin-top:  90px;
margin-left: 374px;
max-height:  400px;
width: 390px;
}

#npc_box  #training_information h5 {
clear: both;
}

#npc_box #pass_img {
width: 25px;
}

#npc_box .primary_product_display .scent .pn_box,
#npc_box .primary_product_display .breeder_select .pn_box {
width: 134px;
}

#npc_box .primary_product_display #info_display {
clear: both;
}

#npc_box .primary_product_display #info_display #info_sprite {
float: left;
}

#npc_box .primary_product_display #info_display #info_list,
#npc_box .primary_product_display #info_display #info_para {
float: left; 
width: 270px; 
clear: right;
}

#npc_box  .primary_product_display .no_clearance {
float: left; 
width: 270px; 
clear: none;
}

#npc_box  .primary_product_display .clearance {
clear: both;
}

.primary_product_display .small_item_icon {
width:                30px;
height:               30px;
margin: 0px 5px -6px 5px;
}

.primary_product_display .sm_marble {
width:                30px;
height:               30px;
}

#npc_box  .primary_product_display h4, #npc_box  .primary_product_display h5, #npc_box  .primary_product_display h3 {
border-radius:        5px;
text-align:           center;
margin:               10px 0 0 124px;
width:                260px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box  .primary_product_display h5, #npc_box  .primary_product_display h3 {
border-radius:        5px;
text-align:           center;
margin:               6px 8px 6px 8px;
width:                auto;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .primary_product_display #product_img, .primary_product_display  .sm_product_img {
margin:               10px 10px 10px 10px;
float:                left;
background-color:   #282535;
border:             black dotted 2px;
}

.sm_product_img {
width: 75px;
height: 75px;
}

#npc_box .primary_product_display .food {
border:               2px solid #3f4383;
box-shadow:           5px 5px 10px black;
}

#npc_box .primary_product_display .stretch_select {
width:             380px;
margin:            0 auto 0 auto;
display:           block;
}

#npc_box .primary_product_display p, #npc_box .secondary_product_display p {
clear:               both;
margin:              10px 5px 10px 5px;
padding:             5px;
border-radius:       5px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .primary_product_display .thin_table {
float:                left;
width:                275px;
margin-top:           5px;
}

#npc_box .primary_product_display .cooking_table {
font-size: 40px;
}

#npc_box .primary_product_display .creature_cooking_table {
width: 96%;
margin-left: 10px;
}

#npc_box .primary_product_display .creature_cooking_table td img,
#npc_box .primary_product_display .cooking_table td img {
margin: 0 auto 0 auto;
display: block;
border: none;
box-shadow: none;
}

#npc_box .primary_product_display .icon {
width: 30px;
height: 30px;
}

#npc_box .primary_product_display .thin_paragraph {
float:                left;
width:                235px;
margin-top:           5px;
padding:              10px;
clear:                right;
}

#npc_box .primary_product_display ul {
clear:               both;
margin:              5px;
padding:             5px;
background-color:   #282535;
border:             black dotted 2px;
border-radius:       5px;
list-style:          none;
}

#npc_box .primary_product_display ul li {
margin: 5px 0 5px 0;
}

#npc_box .primary_product_display table {
width:                100%;
}

#npc_box .primary_product_display table th {
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .primary_product_display .build_ingredient {
width: 30px;
}

#npc_box .primary_product_display .enchantment_dp {
clear: both;
height: 100px;
overflow: auto;
background-color:   #282535;
border:             black dotted 2px;
margin: 0 4px 0 4px;
border-radius: 5px;
}

#npc_box .primary_product_display .enchantment_dp ul,
#npc_box .primary_product_display .enchantment_dp h3 {
background: transparent;
border: none;
}

#npc_box .primary_product_display#custom_shop_primary_display #c_stand, 
#npc_box .primary_product_display#custom_shop_primary_display #c_portrait {
border: black solid 2px;
background-color:   #282535;
border-radius: 15px;
width: 175px;
height: 175px;
}

#npc_box .primary_product_display#custom_shop_primary_display #c_stand {
margin-left: 10px;
}

#npc_box .primary_product_display#custom_shop_primary_display #c_portrait {
margin-left: 10px;
}

#npc_box #pass_amount {
width: 50px;
}

#npc_box #shop_button_box, 
#npc_box #long_shop_button_box,
#npc_box #shop_button_box_f {
position:           absolute;
margin:             490px -450px 0 370px;
}

#npc_box #shop_button_box_f {
margin:             490px -450px 0 420px;
}

#npc_box #shop_button_box a, 
#npc_box #long_shop_button_box a,
#npc_box #shop_button_box_f a {
text-decoration:    none;
}

#npc_box #shop_eq_build_menu {
width:                400px;
min-height:           100px;
margin:                10px 0 0 200px;
position:             absolute;
box-shadow:           5px 5px 10px black;
border-radius:        15px;
color:                white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
z-index: 20;
display: none;
}

#npc_box #shop_eq_build_menu #product_img {
border-radius: 15px;
background-color: #282535;
border: black solid 2px;
margin: 15px auto 15px auto;
display: block;
}

#npc_box #shop_eq_build_menu table {
margin: 0 auto 0 auto;
}

#npc_box .secondary_product_display {
padding:            0px 4px 4px 4px;
color:              white;
position:           absolute;
width:              400px;
margin:             236px 0 0 400px;
max-height:         235px;
overflow: auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#npc_box .secondary_product_display#auction_secondary {
margin-top: 260px;
}

#npc_box .secondary_product_display#custom_shop_secondary_display {
max-height: 300px; 
overflow: auto;
width:                   380px;
margin-left:             370px;
}

#npc_box .shop_stock #custom_sale_conditionals .shop_selection, 
#npc_box .shop_stock #custom_sale_conditionals .shop_selection p {
height: auto;
}

#npc_box .secondary_product_display#custom_shop_secondary_display #custom_pricing_menu {
}

#npc_box .secondary_product_display#custom_shop_secondary_display #custom_pricing_menu .percentage {
width: 40px;
}

.secondary_product_display#breed_shop_secondary {
margin-top: 100px;
max-height: 400px;
}

#npc_box .secondary_product_display ul {
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .secondary_product_display .pn_box_link {
display: block;
width: 150px;
}

#npc_box .secondary_product_display#eq_shop_secondary {
margin:             186px 0 0 380px;
height: auto;
max-height: 400px; 
}

#npc_box .secondary_product_display .icon {
width: 20px;
}

#npc_box .secondary_product_display #scent_info_display {
overflow:           auto;
height:             80px;
}

#npc_box .secondary_product_display h4 {
border-radius:        5px;
text-align:           center;
margin:               10px auto 10px auto;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .secondary_product_display div h5 {
text-align:        center;
font-size:         12px;
margin:            0 0 4px 0;
padding:           0 0 0 0;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box .secondary_product_display .inner_div p {
background-color:   #282535;
border:             black dotted 2px;
}


#npc_box .secondary_product_display #fitting_information {
height: 170px;
overflow: auto;
border-radius: 15px;
}

#npc_box .secondary_product_display #fitting_selection {
display: block;
margin: 0 auto 0 auto;
}

#npc_box .secondary_product_display #fitting_information .equals {
color: yellow; 
font-size: 30px;
}

#npc_box .secondary_product_display #fitting_information .unknown {
color: violet; 
font-size: 30px;
}

#npc_box .secondary_product_display #fitting_information table {
width: 100%;
}

#npc_box .secondary_product_display #fitting_information img {
float: none;
width: auto;
height: auto;
}

#npc_box .secondary_product_display div {
min-height:        30px;
color:             white;
text-align:        center;
font-size:         12px;
padding:           3px 3px 3px 3px;
margin:            4px 0 0 0px;
background-color:   #2f2d3f;
border:             black dotted 2px;
}

#npc_box .secondary_product_display div img {
width:             25px;
height:            25px;
margin:            2px 2px 0px 0;
float:             left;
}

#npc_box .secondary_product_display #return_button {
background: url('/images/icons/return.png') no-repeat;
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
}

#npc_box .secondary_product_display #return_button:hover {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

.secondary_product_display ul {
text-align: left;
list-style: none;
padding-left: 5px;
}

.secondary_product_display ul li {
margin-top: 5px;
margin-bottom: 5px;
}

#npc_box .secondary_product_display #alchemy_number {
width: 80px;
}

#color_picker_display {
width:          100px;
height:         100px;
margin:         0 0 0 150px;
}

#npc_box #additional_auction_menu {
width:                400px;
min-height:           100px;
margin:               110px 0 0 -40px;
position:             absolute;
border-radius:        15px;
color:                white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#holding_auction, #not_holding_auction, #bid_holding_menu {
display: none;
}

#npc_box #auc_op select, #npc_box #auc_op input {
display: block;
margin: 0 auto 0 auto;
}

#npc_box #additional_auction_menu .ac_input {
width: 270px;
}

#npc_box #additional_auction_menu table {
width:               100%;
text-align:          center;
}

#npc_box #additional_auction_menu h4, 
#npc_box #additional_auction_menu th {
margin:                4px 0 4px 0;
text-align:            center;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box #additional_auction_menu td {
}

#npc_box #additional_auction_menu h4 {
padding:                5px 0px 5px 0px;
background:             none;
border:                 none;
}

#npc_box #additional_auction_menu h5 {
text-align:             center;
margin:                 4px 0 4px 0;
}

#npc_box #additional_auction_menu h4 select {
margin:                5px 0px 5px 0px;
}

#npc_box #additional_auction_menu p {
margin:                5px;
text-align:            left;
padding: 2px;
background-color:   #282535;
border:             black dotted 2px;
}

#npc_box #additional_auction_menu p select {
margin:                0 auto 0 auto;
display:               block;
}

#npc_box #additional_auction_menu p input {
margin:                0 auto 0 auto;
display:               block;
}

#npc_box #additional_auction_menu ul {
list-style: none;
text-align: left;
}

.credit_color {
color: aqua;
}

.coins_color {
color: yellow;
}

.gold_lesp_tokens_color {
color: gold;
}

.silver_lesp_tokens_color {
color: silver;
}


.atrophy_coins_color {
color: #b47a7a;
}

.loyalty_points_color {
color: pink;
}

.holiday_event_points_color {
color: orange;
}

/* Form Colors */

.unavailable_form_color, .Unavailable_form_color {
background-color: #a1a1a1;
color: white;
border-radius: 5px;
padding: 2px;
}

.flame_form_color, .Flame_form_color {
background-color: #783232;
color: white;
border-radius: 5px;
padding: 2px;
}

.water_form_color, .Water_form_color {
background-color: #326278;
color: white;
border-radius: 5px;
padding: 2px;
}

.rock_form_color, .Rock_form_color {
background-color: #7a7266;
color: white;
border-radius: 5px;
padding: 2px;
}

.electric_form_color, .Electric_form_color {
background-color: #bcbb82;
color: white;
border-radius: 5px;
padding: 2px;
}

.shadow_form_color, .Shadow_form_color {
background-color: #4f3d6a;
color: white;
border-radius: 5px;
padding: 2px;
}

.sacred_form_color, .Sacred_form_color {
background-color: #fdfdfd;
color: black;
border-radius: 5px;
padding: 2px;
}

.ghost_form_color, .Ghost_form_color {
background-color: #afbed3;
color: black;
border-radius: 5px;
padding: 2px;
}

.wrath_form_color, .Wrath_form_color {
background-color: #87655b;
color: white;
border-radius: 5px;
padding: 2px;
}

.ice_form_color, .Ice_form_color {
background-color: #d0fcff;
color: black;
border-radius: 5px;
padding: 2px;
}

.poison_form_color, .Poison_form_color {
background-color: #e4d0ff;
color: black;
border-radius: 5px;
padding: 2px;
}

.plant_form_color, .Plant_form_color {
background-color: #4b6938;
color: white;
border-radius: 5px;
padding: 2px;
}

.wind_form_color, .Wind_form_color {
background-color: #b1e2b1;
color: black;
border-radius: 5px;
padding: 2px;
}

/* End Form Colors */

#npc_box #additional_auction_menu .tracked_auctions {
height:  400px;
overflow: auto;
}

#npc_box #additional_auction_menu .tracked_auctions div {
background-color: #1f3162;
border-radius: 5px;
padding: 5px;
margin: 5px;
border: black solid 2px;
}

#npc_box #additional_auction_menu .tracked_auctions p {
margin:   5px 0 5px 0;
background: none;
border: none;
}

#npc_box #additional_auction_menu .tracked_auctions div img {
width:    30px; 
height:   30px;
float:    left;
margin:   5px;
}

/* WARP LAYOUT */

#warp_box {
position:          absolute;
width:             400px;
height:            500px;
margin:            -60px 0 0 400px;
color:             white;
overflow:          auto;
} 

#warp_box div {
width:             170px;
height:            40px;
font-size:         14px;
margin:            2px;
padding:           2px;
float:             left;
color:             white;
text-overflow:     ellipsis;
white-space:       nowrap;
overflow:          hidden;
-o-text-overflow:  ellipsis;  
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#warp_box div img {
height: 40px;
width:  40px;
float:  left;
margin: 1px;
}

#warp_box div p {
text-decoration:    none;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
line-height: 40px;
margin: 0 0 0 50px;
padding: 0;
}

#warp_box  h3 {  
margin:               5px 0 5px 0px;
color:                white;
text-align:           center;
font-size:            14px;
background-color:   #282535;
border:             black dotted 2px;
}
/* END OF WARP LAYOUT */

/* NEWS LAYOUT */

#news_display_box {
width:                400px;
max-height:           500px;
overflow:             auto;
float:                left;
color:                white;
margin:              80px 0 0 -34px;
overflow:            auto;
position: absolute;
z-index: 20;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#news_display_box h4 {
margin: 0 auto 0 auto;
border-top: none;
border-right: none;
border-left: none;
font-size: 18px;
background-color:   #282535;
border:             black dotted 2px;
}

#news_display_box div {
padding: 20px;
}

#news_display_box h5 {
text-align: right;
font-size: 15px;
margin-right: 20px;
}

#news_display_box .close {
margin-top: 30px;
}


#npc_box #news_box {
position:         absolute;
min-height:       70px;
opacity:          1;
color:            white;
padding:          2px 0px 5px 0px;
width:            400px;
margin:           -60px 0px 0 400px;
float:            left;
border-radius:    15px;
z-index: 15;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;

}

#npc_box #news_box h3  {
margin:          0;
padding:         0;
text-align:      center;
color:           white;
}

#npc_box #news_box ul {
margin: 0;
padding: 0;
}

#npc_box #news_box ul li {
background-color:   #282535;
border:             black dotted 3px;
list-style:     none;
margin:         15px 10px 30px 10px;
font-size:      20px;
border-radius: 15px;
font-size: 15px;
}

#npc_box #news_box ul li h4 {
margin: 0;
padding: 0;
}

#npc_box #news_box ul li:hover {
border:            #4e4d5e dotted 3px;
background-color:   #5e5d70;
}

#npc_box #news_box ul #prev,
#npc_box #news_box ul #next {
width: 144px;
border-radius: 0;
}

#npc_box #news_box ul #prev {
text-align: left;
padding-left: 30px;
border-top-left-radius: 50px;
border-bottom-left-radius: 50px;
float: left;
}

#npc_box #news_box ul #next {
text-align: right;
padding-right: 30px;
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
float: right;
}

#news_box ul li i {
margin: 2px 0 0 0;
font-size: 14px;
float: right;
}

/* End of News Layout */
/* npc other layout */
/* auction */

#npc_box .shop_arrows {
min-height:            40px;
width:             380px;
text-align:        right;
font-weight:       bold;
color:             white;
padding:           0;
margin:            180px 0 0 380px;
position:          absolute;
z-index:           5;
border-radius: 5px;
line-height: 36px;
}

#npc_box .shop_arrows#custom_seller {
margin:            360px 0 0 380px;
}

#npc_box .shop_arrows div:hover {
background-color: #0a132b;
}

#npc_box .shop_arrows#auction_arrows {
margin:            200px 0 0 380px;
}

#npc_box .shop_arrows .left_button, 
#npc_box .shop_arrows .right_button {
font-size: 10px;
width: 60px;
height: 36px;
text-align: center;
font-size: 15px;
border-radius: 5px;
margin: 2px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

#npc_box .shop_arrows .left_button {
float: left;
padding-left: 10px;
padding-right: 10px;
}

#npc_box .shop_arrows .right_button {
float: right;
}

#npc_box .shop_arrows .left_button:hover,
#npc_box .shop_arrows .right_button:hover {
border:            #4e4d5e dotted 3px;
background-color:   #5e5d70;
}

/* Begin Mail Layout */

#mail_notice {
width: 90%;
color: white;
background-color:   #282535;
border:             black dotted 2px;
margin: 5px auto 5px auto;
padding: 0;
}

#mail_notice h4 {
padding: 0;
margin: 0;
font-size: 16px;
}

#mail_container {
max-height:        516px;
width:             420px;
float:             right;
margin:            -60px 0px 0 370px;
padding:           6px;
position:          absolute;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#mail_container #mail_list {
max-height: 430px;
overflow: auto;
width:  420px;
}

#mail_container #mail_list #load_more_mail_button {
margin: 5px auto 0 auto;
display: block;
}


#mail_container #mail_list .mail_box {
min-height:        45px;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
width: 390px;
background-color:   #282535;
border:             black dotted 2px;
}

#mail_container #mail_list .mail_box .contact {
display:           block;
height:            38px;
width:             40px;
float:             left;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
clear:             both;
}

#mail_container #mail_list .mail_box  .contact img {
margin:            5px auto 0 auto;
display:           block;
}

#mail_container #mail_list .mail_box .letter {
float:             left;
height:            38px;
color:             #9f9f9f;
}

#mail_container #mail_list .mail_box .letter  a {
color:             #d1d1d1;
}

#mail_container #mail_list .mail_box .letter  a:hover {
color:             white;
}

#mail_container #mail_list .mail_box .letter input {
display:           none;
}

#mail_container #mail_list .mail_box .letter  p {
margin: 0;
clear: left;
white-space: nowrap;
}

#mail_container #mail_list .mail_box .letter div  {
width:             345px;
}

#mail_container #mail_list .mail_box .letter div i {
margin-right: 3px;
float:            right;
}

#mail_container #mail_list .mail_box .letter div a {
text-decoration:   none;
}

#mail_container #mail_list .mail_box .letter div img {
float:             right;
}

#mail_container #mail_list .mail_box .letter .delete_button {
-webkit-transition: all 1s ease;
transition:         all 1s ease;
margin-top: -17px;

}

#mail_container #mail_list .mail_box .letter .delete_button:hover {
opacity:           .50;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

#mail_container .mail_options {
min-height:        20px;
width:             356px;
font-size:         12px;
border-radius:     10px;
padding: 5px;
}

#mail_container .mail_options #filter_button {
height: 80px;
display: block;
border: black dotted 3px;
border-radius: 5px;
}

#mail_container .mail_options div {
float: left;
color: white;
width: 50px;
}

#mail_container .mail_options #filter_panel {
display: none;
z-index: 5;
position: absolute;
height: 160px;
width: 410px;
padding: 5px;
margin-top: -40px;
margin-left: -8px;
border-radius: 15px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
border: black dotted 4px;
}

#mail_container .mail_options h4 {
margin: 0;
font-size: 15px;
color: white;
text-align: center;
width: 400px;
}

#mail_container .mail_options p {
color: white;
width: 400px;
text-align: center;
}

#mail_container .mail_options img {
margin:             2px 4px 0px 4px;
}

#mail_container .mail_options table {
color:              white;
clear:              both;
white-space:        nowrap; 
margin:             10px auto 0 auto;
width: 420px;
text-align: center;
}

#mail_container .mail_options table td b {
color:               lime;
}

#mail_container .mail_options table input {
width:               90px;
font-size:           12px;
}


#mail_display {
position:           absolute;
z-index:            5;
margin:             -60px 0 0 -30px;
background-color:      #353749;
border: black dotted 2px;
z-index: 19;
}

#mail_display div {
min-height:         26px;
width:              810px;
padding:            10px;
}

#mail_display  .single_mail_options {
width:              820px;
padding:            5px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

#mail_display div .pn_box {
background-repeat: no-repeat;
font-size:         15px;
background-position:center left;
padding-left: 30px;
margin-left: 10px;
}

#mail_display #to, 
#mail_display #ma_header {
width: 95%;
}

#mail_display div textarea {
width:                95%;
max-height:         140px;
overflow: auto;
}

#mail_display #send {
margin: 10px 0 10px 710px;
}

#mail_display div .contact {
width:            100px;
height:           100px;
margin:           5px 5px 0 0px;
float:            left;
color:            white;
display:          block;
border:           none;
background-color:   #282535;
border:             black dotted 2px;
border-radius:    10px;
}

#mail_display div p {
color:            white;
margin:           10px 0 0 120px;
max-height:       400px;
width:            665px;
overflow:         auto;
background-color:   #282535;
border:             black dotted 2px;
padding:          10px;
}

#mail_display div #contact_warning {
width:            auto;
margin:           5px 0 5px 0px;
}

#mail_display div p i {
opacity:           .50;
}

#mail_display div h4 {
width:            665px;
color:             white;
margin:           0 0 0 120px;
text-align: left;
padding:           0px 0px 0 5px;
}

#mail_display div h3 {
width:             120px;
color:             white;
padding:           3px 0px 3px 5px;
margin:            7px 0 7px 0;
border:            1px solid black;
font-family:       verdana;
font-size:         12px;
font-style:        italic;
background-color:   #282535;
border:             black dotted 2px;
}

#mail_display div span {
color:             white;
}

#mail_display div span img {
margin:       0 10px 0 10px;
}

#mail_display div h5 {
height:           20px;
width:            680px;
color:            white;
margin:           10px 0 0 120px;
padding:          0px 0px 0 5px;
background-color:   #282535;
border:             black dotted 2px;
}

/* End of Mail layout */

/* equip creature layout */

#equip_creature_notice {
margin: 2% auto 0 auto;
padding: 0 0 0 0;
color: white;
width: 90%;
}

#equip_creature_notice h4 {
margin: 0 auto 0 auto;
padding: 0 0 0 0;
background-color:   #282535;
border:             black dotted 2px;
font-weight: normal;
}

#equip_creature_menu {
width:               854px;
height:              5px;
margin:              15px 0 0 5px;
background-color: #402f44;
border: black dotted 2px;
border-bottom:       0px;
}

#equip_creature_menu img {
border:              none;
}

#equip_creature_menu table {
margin:              2px auto 0 auto;
}

#character_panel {
width:               200px;
height:              386px;
color:               white;
float:               left;
background-color: #402f44;
border-left: black dotted 2px;
margin-left: 5px;
}

#character_panel #critter_level {
margin-bottom: -10px;
}

#character_panel h4 {
margin:              0 auto 0 auto;

padding:             1px;
border-radius:       10px;
width:               180px;
}

#character_panel .spr_image {
margin:              10px 0 10px 40px;
display:             block;
width:               125px;
height:              125px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;
border-radius:       10px;
}

#character_panel table {
width:               180px;
height:              140px;
color:               white;
margin:              0 auto 0 auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;
text-align:          center;
font-size:           12px;
border-radius:       15px;
}

#equip_selection_box {
width:               250px;
height:              386px;
padding-left:        2px;
color:               white;
float:               left;
background-color: #402f44;
background-position: right; 
}

#equip_selection_box ul {
list-style: none;
padding: 0;
}

#equip_selection_box ul li h5 {
height:              26px;
width:               250px;
text-align:          center;
background-color:   #282535;
border:             black dotted 2px;
margin:              10px 0 0 0;
}

#equip_selection_box ul li select {
width: 210px;
}


#equip_selection_box ul li .examine {
-webkit-transition: all 1s ease;
transition:    all 1s ease;
width: 30px;
float: right;
}

#equip_selection_box ul li .examine:hover {
opacity: .50;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

.eq_output, #compare_arrow {
height:              386px;
background-color: #402f44;
float:               left;
padding-left:        10px;
color:               white;
}

#compare_arrow {
width:               104px;
}

.eq_output  {
width: 176px;
overflow: auto;
font-size:           14px;
background-color: #402f44;
background-position: center; 
}

.eq_output .sm_marble {
width: 20px;
}

.eq_output ul {
list-style: none;
margin: 0 auto 0 auto;
width: auto;
padding: 5px;
border-radius: 5px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.eq_output ul li {
margin: 0;
padding: 0;
}

.eq_output ul li img {
margin: 0 8px 0 0px;
}

.eq_output p {
font-size:           12px;
border:              black dotted 2px;
background-color:   #282535;
padding:             6px;
border-radius:       5px;
}

#compare_arrow {
width: 20px;
}

#compare_arrow img {
margin-top: 75px;
}

#compare_arrow img:hover {
opacity:            .25;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

#equip_secondary_output {
border-right:        black dotted 2px;
}

.eq_output p, .eq_output ul {
margin:      2px 3px 2px 6px;
}

.eq_output .eq_img {
width: 30px;
margin: 0 auto 0 auto;
display: block;
}

.eq_output h4 {
margin: 2px;
font-size: 16px;
}

.eq_output b {
color:       lime;
}

#bottom_equip_management {
width:               854px;
clear:               both;
margin-left:         5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
overflow: auto;
background-color: #402f44;
border: black dotted 2px;
border-top:          none;
}

#bottom_equip_management ul {
list-style: none;
margin: 0 0 0 16px;
padding: 0;
width: auto;
overflow: auto;
float: left;
border-radius: 5px;
border:             black dotted 2px;
}

#bottom_equip_management ul li {
float:               left;
padding: 5px;
}

#bottom_equip_management ul li {
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

#bottom_equip_management ul li img {
width: 30px;
}

#bottom_equip_management ul .chosen {
background-color: #6d2929;
}

#bottom_equip_management input {
margin-right: 140px;
float: right;
}

#quick_creature {
color:               white;
margin:              15px auto 4px auto;
clear:               both;
border-radius:       5px;
padding:             5px;
width:               400px;
background-color:   #282535;
border:             black dotted 2px;
}

/* end of equip creature layout */

/* begin story layout */

#story_display_box {
width:              824px;
min-height:         100px;
overflow: auto;
padding:            0 0 0px 0;
margin:             20px auto 0px auto;
color:              white;
border:             2px dotted black;
border-radius:    15px;
background-color: #402f44;
}

#story_display_box .main_story_img {
margin: 3%;
border-radius: 5%;
border: black solid 2px;
box-shadow:         5px 5px 5px black; 
}

#story_display_box .main_story_div {
margin: 3%;
}

#story_display_box .main_story_div h6 {
margin: 1% 0 1% 0;
font-size: 14px;
text-align: center;
}

#story_display_box .main_story_div img {
border-radius: 5%;
width: 100%;
border: black solid 2px;
}

#story_display_box #difficulty_selector {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}


#story_display_box #difficulty_selector p {
text-align: left;
padding: 5px;
background-color:   #282535;
border:             black dotted 2px;
}

#story_display_box #difficulty_selector img {
-webkit-transition: all 1s ease;
transition:    all 1s ease;
border:                     black dotted 4px;
}

#story_display_box #difficulty_selector img:hover {
opacity: .50;
}

#story_display_box #difficulty_selector img:active {
border-color: lime;
opacity: .20;
}

#story_display_box #selection_notice {
text-align: center;
clear: both;
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
}

#story_display_box #episode_selector {
margin:            0; 
padding:           0;
list-style:        none;
}

#story_display_box #episode_selector li {
float: left;
width: 45%;
margin: 2% 2% 2% 2%;
}

#story_display_box #episode_selector li img {
width: 100%;
display: block;
border: black dotted 4px;
background-color:   #282535;
}

#story_display_box #episode_selector li p {
text-align: center;
margin: 0 0 0 0;
padding:  1% 0 1% 0;
}

#story_display_box #episode_selector li img:hover {
opacity: .50;
}

#story_display_box #episode_selector li a {
margin: 0;
padding: 0;
display: inline;
}

#story_display_box #summary_selection, #story_display_box #next_page {
color: white;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000;  
background-image: url("/images/main/pn-button.jpg");
background-color: #5e6180;
border: black dotted 3px;
}

#story_display_box #summary_selection {
float: right;
border-bottom-left-radius: 30px;
padding-bottom: 5px;
}

#story_display_box #summary_selection a {
margin-top: -10px;
}

#story_display_box #next_page {
float: right;
border-top-left-radius: 30px;
padding: 15px;
clear: right;
}

#story_display_box #summary_selection:hover, #story_display_box #next_page:hover {
background-image: url("/images/main/pn-button-light.jpg");
}

#story_display_box ol li {
margin-top: 15px;
}

#story_display_box p {
margin:  15px 15px 15px 15px;
}

#story_display_box a {
float: right;
padding: 5px;
}

#story_display_box li a {
float: none;
padding: 2px;
}

#story_display_box form {
margin: 20px;
border-radius: 10px;
background-color:   #282535;
border:             black dotted 2px;
box-shadow:         5px 5px 10px black; 
}

#story_display_box form h4 {
padding: 0;
margin: 0;
}

#story_display_box form p {
margin-left: 250px;
}

#story_display_box table {
margin:             0 auto 15px auto;
text-align:         center;
background-color: #1e2c52;
border-radius:    15px;
width: 790px;
border: #49567b solid 1px;
}

#story_display_box table ul {
text-align: left;
background-color:   #282535;
padding: 2% 2% 2% 6%;
border: black solid 2px;
}

#story_display_box table img {
border:             1px solid black;
}

#story_display_box .story_image {
margin:             6px 12px 6px 12px;
box-shadow:         5px 5px 10px black; 
background:         #111a34;
}

.story_avatar {
width:             100px; 
height:            100px;
margin:            10px;
padding:           0;
display:           block;
box-shadow:    5px 5px 10px black;
background-repeat: no-repeat;
background-color:  #8f7d51;
}

#story_display_box h3 {
width:              700px;
text-align:         center;
margin:             10px auto 10px auto;
}

#story_display_box p.story {
margin:             5px 26px 10px 26px;
padding: 5px;
}

#story_display_box a:focus, #story-npc-talk a:focus {
outline:            none;
color:              violet;
}

div.event {
width:              350px; 
height:             350px; 
margin:             0 auto 0 auto;
background-color:   black;
border:             2px solid black;
}

#comic_page {
}

#comic_page img {
margin:           10px auto 10px auto;
display:          block;
border:           #2d4d79 solid 2px;
box-shadow:       5px 5px 10px black;
border-radius:    10px;
}

.center_link {
margin: 5px auto 5px auto;
clear: both;
padding: 5px 0 0 35px;
width: 250px;
display: block;
background:         url(../images/icons/comparisons/g-greater.gif) no-repeat left;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

.map_object {
transition:    all 1s ease;
-webkit-transition: all 1s ease;
}

#second_map_box {
margin:             0 auto 0 auto;
border:             3px dotted black;
background-repeat: no-repeat;
border-top: none;
background-color: black;
}

#second_map_box #magnifier {
width: 50px;
}

/* Begin Dungeon Reward Layout*/

#mass_dungeon_rewards {
width: 700px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
margin: 15px auto 10px auto;
border-radius: 15px;
padding: 10px;
}

#mass_dungeon_rewards ul {
background-color:   #282535;
border:             black dotted 3px;
}

#mass_dungeon_rewards ul img {
width: 30px;
margin-bottom: -7px;
}

#mass_dungeon_rewards ul li {
line-height: 30px;
}

#mass_dungeon_rewards ul li .has_space {
color: lime;
}

#mass_dungeon_rewards ul li .has_space:hover {
color: #13691f;
}

#mass_dungeon_rewards ul li .no_space {
color: red;
}

#mass_dungeon_rewards ul li .no_space:hover {
color: #691313;
}

#dungeon_rewards {
}

#dungeon_rewards div {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
width:            354px;
min-height:       170px;
margin:           10px;
border-radius:    10px;
padding:          15px;
margin:           10px auto 10px auto;
}

#dungeon_rewards .make_space {
float: left; 
margin: 10px;
}

#dungeon_rewards div .reward-image {
float:            left;
clear:            both;
margin:           10px;
}

#dungeon_rewards div h4 {
background-color:   #282535;
border:             black dotted 2px;
text-align:       center;
padding:          5px;
margin:           0 0 0 0;
border-radius:    10px;
clear:            both;
}

#dungeon_rewards div span {
color: violet;
}

#dungeon_rewards #reward_exit, #mass_dungeon_rewards #reward_exit {
display:    block;
width:      300px;
text-align: center;
margin:     7px auto 7px auto;
clear:      both;
background-color:   #282535;
border:             black dotted 2px;
padding:           3px;
border-radius:    10px;
color:            lime;
-webkit-transition: all 1s ease;
transition:         all 1s ease;
}

#dungeon_rewards #reward_exit:hover {
color:             violet;

}

#dungeon_rewards .he_reward {
position:           absolute;
margin:             -25px 0 0 25px;
}

#dungeon_rewards #manage_button {
height: auto;
float: right;
margin: 0;
padding: 0;
min-height: auto;
margin-top: 3px;
margin-right: 0px;
width: 780px;
background: none;
border: none;
}

#dungeon_rewards #manage_button input {
width: 200px;
float: right;
margin-right: 10px;
}

#dungeon_party_manage, #supply_viewer, #dungeon_item_menu {
width:      500px;
z-index:    10;
margin:     50px 0 0 75px;
color:      white;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
}

#dungeon_party_manage {
background-color: #402f44;
}

#dungeon_item_menu table {
margin: 0 auto 0 auto;
}

#dungeon_party_manage h4 {
height: 30px;
}

#dungeon_party_manage .close, #supply_viewer .close {
width: 30px;
height: 30px;
}

#dungeon_party_manage .creature_card {
width: 150px;
}

#dungeon_party_manage .creature_card h6 {
font-size: 16px;
}

#dungeon_party_manage .creature_card .magnifier {
width: 30px;
}

#dungeon_party_manage .creature_card .card_spr {
width: 125px;
height: 125px;
}

#dungeon_party_manage .creature_card table {
font-size: 14px;
margin: 0 auto 0 auto;
}

#dungeon_party_manage #option_container {
border:        2px dotted black;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border:       black dotted 2px;

width: 94%;
clear: both;
overflow: auto;
border-radius: 6px;
padding: 2% 2% 2% 2%;
margin: 2% 0 2% 0;
display: block;
}

#dungeon_party_manage #option_container #ch {
float: left;
}


#dungeon_party_manage #option_container #he {
margin-top: 5px;
clear: both;
float: left;
}

#supply_viewer {
width: 270px;
margin-left: 275px;
}

#supply_viewer table {
margin: 0 auto 0 auto;
}

#dungeon_party_manage h4, #supply_viewer h4 {
margin: 5px 0 5px 0;
}

#dungeon_notice {
width:                250px;
position:             absolute;
background:           rgba(0,0,0,0.7);
background-color:     black;  
border-radius:        15px;
padding:              0px;  
font-size:            13px;
margin:               20px 0 0 20px;
padding:              10px;
}

#dungeon_notice p {
margin:               0;
padding:              5px;
}

#diff_header {
color: white;
padding: 10px 5px 10px 5px;
margin: 0 auto 0 auto;
width: 816px;
font-size: 13px;
background-color: #401919;
}

#dungeon_map #uber_enemy h5, #dungeon_map #holiday_event h5 {
margin: 0;
padding: 3px;
border-radius: 10px;
background-color: #132147;
border:    2px black solid;
text-align: center;
}

#dungeon_map #uber_enemy h5 b, #dungeon_map #holiday_event h5 b {
color: red;
}

#dungeon_map #uber_enemy span, #dungeon_map #holiday_event span {
background-color: #353648;
}

#dungeon_map .dungeon_enemy {
box-shadow: 0px 0px 10px #fff65f;
border-radius: 5px;
background: rgba(255,246,95,0.50);
}

#dungeon_map .hunt_creature {
box-shadow: 0px 0px 10px #fff65f;
border-radius: 5px;
background: rgba(255,246,95,0.50);
width: auto;
height: auto;
}

#dungeon_map .hunt_creature span {
background-color: #22212a;
}

#dungeon_map .dungeon_enemy_click {
box-shadow: 0px 0px 10px #ff5f5f;
border-radius: 5px;
background: rgba(255,95,95,0.50);
}

#dungeon_map .tiny_dungeon_sprite {
width: 35px;
height: 35px;
}

#dungeon_map div {
width:             45px;
height:            45px;
position:          absolute;
}

#dungeon_map div a {
text-decoration:      none;
padding:              0 0 0 0;
margin:               0 0 0 0;
}

#dungeon_map div span {
clear:              both;
width:              40px;
margin:             0 0 0 0;
border:             2px solid black;
text-align:         center;
display:            block;
font-size:          12px;
word-wrap:  break-word;
}

#dungeon_map div img {
position:          relative;
float:             left;
}

#dungeon_map #panel {
border-radius:         5px;
width:                 100px;
position:              absolute;
margin:                5px 0 0 360px;
padding:               5px 5px 5px 5px;
color:                 red;
line-height:           40px;
font-size:             20px;
font-weight:           bold;
}

#dungeon_map #panel div {
position:              relative;
float:                 left;
width:                 80px;
}

#dungeon_map #panel div img {
float:                 left;
margin-right:          5px;
}

#dungeon_container {
width:              758px; 
margin:             0 auto 0 auto;
}

#dungeon_container h6 {
line-height:                  30px;
margin:                       0 0 0 50px;
width:                        702px;
text-align: center;
border-top-right-radius:      15px;
border-top-left-radius:      15px;
border-bottom-right-radius:   0px;
border-bottom-left-radius:    0px;
font-size:                    18px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;
border-bottom:                none;
}

#dungeon_map {
height:             450px; 
width:              450px;
float:              left;
border: black dotted 2px;
background-repeat: no-repeat;
background-color: black;
}

#dungeon_map img, #map_box img {
border:             none;
position:           absolute;
}

#dungeon_menu {
text-align:         center;
width:              298px;
min-height:         460px; 
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;
border-top:          none;
float:              left;
}

#dungeon_menu table td a {
display: inline;
}

#dungeon_menu table {
width: 300px;
}

#dungeon_menu table th {
background-color:   #282535;
border:             black dotted 2px;
}

#dungeon_menu table td  img {
display:            inline;
margin-top:         -5px;
}

#dungeon_menu table td a img {
display:            block;
margin:             0 0 0 0;
}

#dungeon_menu input {
width:              auto;
}

#dungeon_menu b {
color:              lime;
}

#dungeon_menu table {
border:             none;
}

#dungeon_menu table h2 {
background: none;
border: none;
background-image: none;
box-shadow: none;
font-size: 24px;
width: auto;
}

#dungeon_menu table h2 img {
float: none;
display: inline;
position: relative;
margin-bottom: -10px;
}

#dungeon_menu table p {
text-align: left;
padding: 5px;
}

#dungeon_menu h4 {
background-color:   #282535;
border:             black dotted 2px;
width: 98%;
font-size: 15px;
border-bottom-right-radius:    0px;
border-bottom-left-radius:     0px;
box-shadow: none;
}

/* End story layout.      */
/* Begin admin CP layout. */

.control_box {
width:                 940px;
background:            #333333;
border:                2px solid black;
border-top:            0;
margin:                0 auto 0 auto;
padding:               0 15px 20px 15px;
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
}

.control_box ul {
color:                 white;
list-style:            none;
margin:                0 auto 0 auto;
padding:               10px 15px 10px 15px;
background:            #141414;
border-radius:         15px;
}

.control_box .custom_table {
color:                 white;
background:            #141414;
border-radius:         15px;
padding:               10px 5px 5px 5px;
margin:                0px 0 5px 0;
width:                 100%;
}

.custom_box .custom_table .spr_img {
width: 100%;
height: 100%;
max-width: 100px;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
position: relative;
}

.custom_box .custom_table img:hover {
width: 200%;
height: 200%;
max-width: 150px;
background-color: #0d113b;
border: red dotted 1px;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
z-index: 5;
}

.control_box h4 {
color: white;
background-color: #242424;
border-radius: 20px;
}

.control_box .custom_table th {
background-color: #242424;
border-radius: 20px;
}

.control_box .custom_table input, .control_box .custom_table select {
display: block;
margin: 0 auto 0 auto;
}

.control_box div table {
float:                 left;
color:                 #bcbcbc;
background:            #1d1d1d;
margin:                5px 5px 5px 5px;
box-shadow:            5px 5px 10px black;
border-radius:         15px;
font-family:           Matisse ITC;
font-style:            italic;
border:                2px solid black;
padding:               5px 5px 5px 5px;
}

.control_box div ul {
float:           left;
list-style:      none;
margin:          16px 0 0 -40px;
}

.control_box div iframe {
width:           726px;
height:          435px;
margin:          16px 0 0 10px;
float:           left;
}

.control_box div ul input, .control_box div ul select {
background:     #3c3c3c;
color:          white;
border:         2px solid black;
width:          200px;
}

.control_box table textarea, .control_box table select {
border:                2px solid #333333;
border-radius:         5px;
}

.control_box .admin_info {
font-family:         arial;
font-style:          normal;
overflow:            auto;
font-size:           12px;
background:          black;
height:              400px; 
margin:              0 auto 0 auto; 
width:               920px;
text-align:          left; 
font-size:           12px;
background:          black;
padding-left: 5px;
}

.control_box .admin_info i {
font-size:           12px;
color:               aqua;
}

.control_box div table img {
border:                none;
}

.control_box div table tr td input, .control_box div table tr td select, .control_box div table tr td textarea {
background:            black;
color:                 white;
border:                2px solid #333333;
border-radius:         5px;
}

.control_box .daily_reward {
float: left;
background-color: black;
color: white;
border-radius: 10px;
margin: 15px;
padding: 10px;
width: 100px;
height: 130px;
}

.control_box .daily_reward h4 {
margin: 0;
}

.control_box .daily_reward img {
width: 40px;
margin: 0 auto 0 auto;
display: block;
}

.control_box .daily_reward p {
clear: both;
text-align: center;
font-size: 14px;
}


#admin_notice {
width:                 970px;
background:            #333333;
margin:                0 auto 0 auto;
padding:               5px 0 5px 0;
border:                2px solid black;
border-bottom:         0;
border-top:            0;
margin:                0 auto 0 auto;
text-align:            center;
color:                 white;
}

#admin_notice h4 {
width:                 500px;
margin:                0 auto 0 auto;
background:            red;
color:                 black;
border:                2px dotted black;
}

.admin_menu {
width:                 940px;
background:            #333333;
padding:               10px 15px 0px 15px;
border-top-right-radius:    15px;
border-top-left-radius:     15px;
border:                2px solid black;
border-bottom:         0;
margin:                0 auto 0 auto;
}

.admin_menu  table {
margin:                0 auto 0 auto;
color:                 white;
text-align:            center;

}

.admin_menu table td {
height:                30px;
margin:                0 0 0 0;
font-size:             12px;
border:                1px solid white;
}

.admin_menu table th {
height:                30px;
margin:                0 0 0 0;
background:            black;
color:                 white;
border:                1px solid white;
font-size:             10px;
border-top-right-radius:    15px;
border-top-left-radius:     15px;
}

.admin_menu td {
padding:               0 0 0 0;
}

.admin_menu td a {
width:                114px;
height:               28px;
line-height:          28px;
display:              block;
text-decoration:      none;
background:           black;
}

.admin_menu img { 
border:               none; 
margin:               0 0 0 0;
padding:              0 0 0 0;
display:              block
}

.admin_menu td a:link {
color:                #cccccc;
}

.admin_menu td a:hover {
background:           grey;
color:                white;
}

.admin_menu td a:visited {
color:                #cccccc;
}

.admin_menu textarea {
width:                 800px;
color:                 white;
background:            black;
border:                1px solid white;
display:               block;
margin:                0 auto 0 auto;
}

/* end admin cp layout */

#banner {
background:       black;
width:            875px;
height:           0px;
margin:           0px auto 0 auto;
position: relative;
}

#banner .pn_logo {
margin-left: -85px;
border: none;
margin-top: 15px;
}

#margin_box .developer_info {
width:              875px;
margin:             0 auto 0 auto;
padding:            15px 0 15px 0;
background-color: transparent;
}

#margin_box .developer_info p {
border: red solid 1px;
color: white;
background:         #4b2c55;
}

#margin_box .developer_info table {
color: white;
border:             2px solid black;
background:         #330033;
border-radius: 5px;
margin: 0 auto 0 auto;
padding: 5px;
}

#margin_box .developer_info table td {
color: lime;
}

.bottom_eclectic {
width:              776px;
margin:             10px auto 0 auto;
display: block;
}

.bottom_eclectic p {
color:              white;
text-align:         center;
margin:             5px auto 5px auto;
}

.bottom_eclectic img {
width:              776px;
border:             2px solid black;
}

.bottom_eclectic img a {
border: none;
}

/* player growth layout */

#growth_box {
width:              750px;
min-height:         186px;
padding:            5px 10px 5px 10px;
margin:             15px auto 15px auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
color:              white;
font-size:          12px;
}

#growth_box #growth_amount {
margin:             0px 0 0 0px;
}

#growth_box table {
width:              730px;
color:              white;
text-align:         center;
margin:             0 0 0 10px;
background-color:   #282535;
border:             black dotted 2px;
border-bottom-right-radius:    10px;
border-top-right-radius:       10px;
}

#growth_box h5 {
padding:            5px 0 5px 0;
margin:             3px auto 3px auto;
text-align:         center;
font-size:          16px;
width:              590px;
background-color:   #282535;
border:             black dotted 2px;
font-weight:        normal;
}

/* end of player growth layout */
/* begin taskbar layout */

#taskbar #lesp_countdown_display {
width:                            175px; 
left:                            -175px;
position:                         absolute;
height:                           202px; 
margin-top:                       -211px;
float:                            left;
border-top-right-radius:          15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
border-bottom: none;
text-decoration: none;
color: white;
-webkit-transition: color 1s ease;
transition:    color 1s ease;
}

#taskbar #lesp_countdown_display:hover {
-webkit-transition: color 1s ease;
transition:    color 1s ease;
background-color: #4e6a9d;
}


#mobile_taskbar #lesp_countdown_display {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
}

#mobile_taskbar {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#taskbar #lesp_countdown_display b {
color: lime;
}

#taskbar #lesp_countdown_display h4 {
margin: 4px;
}

#taskbar #lesp_countdown_display #sprite {
width: 70px;
height: 70px;
margin: 0 auto 0 auto;
display: block;
float: none;
}

#taskbar #lesp_countdown_display p {
text-align: center;
}

#taskbar {
z-index:       99;
position:      fixed;
right:         0;
bottom:        0;
width:         100%;
height:        25px;
padding:       5px 0 5px 0px;
color:         white;
margin:        0 0px 0 15px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 4px;
border-bottom: 0px;
}

#taskbar img {
margin-left: 15px;
border: none;

height: 20px;
}

#taskbar #mini_notice {
float:       right;
}

#taskbar #mini_notice img {
margin-right: 20px;
}

#taskbar #mini_chat {
margin-top:                       -415px;
margin-right:                     -50px;
}
 
/* end of taskbar layout */
/* begin chat layout */

#standalone_mini #mini_chat  {
width: 100%;
}

#standalone_mini #mini_chat #chat_messages, #standalone_mini #mini_chat textarea {
width: 95%;
}

#standalone_mini #mini_chat h4 {
height:10vh;
}

#standalone_mini #mini_chat #chat_messages {
height:65vh;
}

#standalone_mini #mini_chat textarea {
height:10vh;
}

#standalone_mini #mini_chat input {
font-size: 5vh;
}

#standalone_mini #mini_chat .top_button {
width: 10vh;
height:10vh;
}

#standalone_mini #mini_chat select {
height: 10vh;
width: 20vh;
}

#standalone_mini #mini_chat h4 {
line-height: 10vh;
font-size: 2vh;
}

#mini_chat {
width:                            245px; 
min-height:                       170px; 
background:                       black;
float:                            right;
font-size:                        11px;
z-index:                          100;
background:                       #333333;
border:                           2px solid black;
border-radius:                    15px;
color: white;
}

#mini_chat #selected_room {
font-size:                        11px;
margin:                           2px 0 1px 38px;
padding:                          2px 0 2px 0;
text-align:                       center;
display:                          block;
border:                           none;
}

#mini_chat input {
border-bottom-left-radius:     15px;
}

#mini_chat a img {
border:      none;
}

#mini_notice img {
margin:      5px 0 0 0px;
}

#mini_chat #chat_messages {
width:              224px; 
height:             325px;
background:         #1a1a1c;
margin:             2px 2px 2px 2px;
border-radius:      15px;
color:              white;
border:             2px solid black;
font-size:          14px;
overflow:           auto;
}

.player_message .player_avatar,
.player_message .content_rating {
width:  20px; 
height: 20px;
}

#chat_messages b a {
text-decoration: none;
}

#chat_messages b a:hover {
opacity: .50;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

#mini_chat textarea {
height:      30px;
width:       224px; 
background:  black;
color:       white;
font-size: 11px;
border:      2px solid #1a1a1c;
margin-left: 3px;
}

#mini_chat #chat_messages div {
word-wrap:   break-word;
margin-left: 3px;
}

#mini_chat input {
background:  #333333;
border:      2px solid black;
font-size:   10px;
color:       white;
margin-left: 3px;
}

#mini_chat select {
float: left;
}

#mini_chat h4 {
margin:     2px 0 0 12px;
float:      left;
padding:    0;
width: 10px;
font-size: 15px;
}

#mini_chat .top_button {
margin:      4px 0px 0 8px;
float:      left;
width: 15px;
height: 15px;
}

#chat_room {
width:       850px;
padding:     0 0 16px 0;
margin:      0 auto 0 auto;
color:       white;
}

#chat_room input {
box-shadow:    2px 2px 5px black;
}

#chat_room h3 {
text-align:  center;
color:       white;
clear:       both;
background:  #333333;
border:      2px solid black;
width:       550px;
margin:      0 auto 0 auto;
border-bottom-left-radius:     15px;
border-bottom-right-radius:    15px;
}


#chat_room h4 {
text-align:  center;
color:       white;
margin:      5px auto 5px auto;
width:       450px;
padding:     3px 3px 3px 3px; 
border-radius:    15px;
background:  #333333;
border:      2px solid black;
}

#chat_room #room_description {
text-align:     center;
color:          white;
margin:         10px auto 0px 8px;
padding-top: 3px;
min-height:     25px;
width:          830px;
border-top-left-radius:     15px;
border-top-right-radius:    15px;
background:     #333333;
border:         black solid 2px;
}

#chat_room div {
float:       left;
box-shadow:    2px 2px 5px black;
}

#chat_room #room_list {
height:      350px;
width:       140px;
background:  #333333;
border:      2px solid black;
border-top-left-radius:     15px;
border-bottom-left-radius:     15px;
border-right:  0px;
overflow:      auto;
padding:      0 0 0 3px;
color:        white;
font-size: 12px;
}

#discord_frame {
height:      550px;
width:       695px;
}

#chat_room #room_list h6, #chat_room #chatter_list h6 {
text-align:      center;
margin:          5px auto 5px auto;
padding:         0;
background:      #1a1a1c;
border-radius:   10px;
width: 120px;
}

#chat_room #room_list ul {
list-style:                 none;
padding:                   0;
margin:                    0 auto 0 auto;
display:                   block;
}

#chat_room #room_list ul .notification {
padding-left: 20px;
line-height: 15px;
}

#chat_room #room_list ul li img {
margin-right: 5px;
}

#chat_room #room_list ul li .room_buttons {
width:                      100px;
display:                    block;
float:                      left;
text-align:                 right;
border-top-left-radius:     15px;
box-shadow:                 0px 0px 0px black;
color:                      white;
text-decoration:            none;
box-shadow:                 2px 2px 5px black;
border:                     black solid 2px;
margin:                     2px 5px 2px 5px;
padding:                    0 15px 0 5px;
text-overflow:              ellipsis;
white-space:                nowrap;
}

#chat_room #chat_messages {
height:      350px;
width:       568px;
background:  #333333;
border:      2px solid black;
overflow:    auto;
}

#chat_room #chat_messages div, #chat_room #chat_messages h5 {
width:       510px;
padding:     0px 8px 0px 8px;
margin:      5px 0 5px 2px;
display:     block;
color:       white;
background:  #1a1a1c;
box-shadow:    5px 5px 10px black;
border-radius:    15px;
word-wrap:  break-word;
}

#chat_room #chat_messages h5 {
text-align:   center;
margin:       10px 0 10px 2px;   
}

#chat_room #chat_messages div i {
float:       right;
color:       white;
}

#chat_room #chatter_list {
height:      350px;
width:       130px;
background:  #333333;
border:      2px solid black;
border-top-right-radius:     15px;
border-bottom-right-radius:    15px;
border-left:      0px;
overflow:         auto;
font-size:        12px;
}

#chat_room #chatter_list  {
margin:           0 auto 0 auto;
}

#chat_room #chatter_list ul {
list-style:       none;
margin:           5px 0 0 5px;
padding:          0 0 0 0;
}

#chat_room #chatter_list ul li {
text-overflow:     ellipsis;
white-space:       nowrap;
line-height:       15px;
}

#chat_room #chatter_list ul li img {
width: 10px; height: 10px;
}

#chat_room #chatter_list ul b {
border-radius:    15px;
padding:          0 4px 0 4px;
}

#chat_room #chatter_list ul img {
border:           none;
margin:           0 1px 0 1px;
}

#chat_room #chatter_list ul a {
text-decoration:  none;
}

#chat_room #chatter_list ul ul {
margin:           0 1px 0 20px;
display:          none;
}

#chat_room #chatter_list ul ul li {
background-color: #1a1a1c;
border:           2px solid black;
width:            90px;
color:            white;
}


#chat_room #chatter_list ul ul li:hover {
background-color: black;
border:           2px solid #1a1a1c;
}

#chat_room #chatter_list ul ul a {
text-decoration: none;
}

#chat_room #chatter_list ul ul a:hover, 
#chat_room #chatter_list ul ul a:active, 
#chat_room #chatter_list ul ul a:visited,
#chat_room #chatter_list ul ul a:link {
color:          white;
}

#chat_room #smiley_box {
min-width:       200px;
height:          60px;
background:      #333333;
border:          2px solid black;
display:         none;
padding-left:    20px;
padding-right:   20px;
border-bottom-right-radius:  15px;
box-shadow:                  2px 2px 5px black;
}

#chat_room #chat_menu_breaker {
float: none; 
clear: both;
}

#chat_room #private_communications_panel {
clear:           both;
float:           none;
background:      #333333;
border:          2px solid black;
border-top-right-radius:  15px;
width:           235px;
padding:         5px;
display:         none;
}

#chat_room #private_communications_panel input {
background-color: #1a1a1c;
}



#chat_room #smiley_box h4, #chat_room #private_communications_panel h4 {
font-size:   12px;
margin-left: 5px;
width:       200px;
background:  #1a1a1c;
text-align:  center;
}

#chat_room #private_communications_panel input {
margin-left: 10px;
}

#chat_room #smiley_box img {
margin:     2px 0px 2px 2px;
}

#chat_room #chat {
width:       846px;
background:  black;
color:       white;
border:      2px solid #1a1a1c;
border-bottom-right-radius:    15px;
border-top-right-radius:       15px;
box-shadow:                    2px 2px 5px black;
}

#chat_room input, #chat_room select {
background:  #333333;
border:      2px solid black;
color:       white;
}

#chat_room input:active {
border:       2px solid black;
background:   #171717;
}


#id_creation {
margin:     0 25px 0 25px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
padding: 10px;
}

#id_creation h1 {
font-size:  24px;
text-align: center;
font-size:         17px;
padding:           0 0 0 0;
margin:            0px 10px 0px 10px;
text-align:        center;
background-color:   #282535;
border:             black dotted 2px;
}

#id_creation p {
margin:     20px 20px 20px 20px;
background-color:   #282535;
border:             black dotted 2px;
padding: 2%;
}

#id_creation textarea {
width: 100%;
background-color:   #22212a;
border:             black dotted 2px;
color: white;
}

#id_creation .flip_sprite {
transform:          scaleX(-1); 
-webkit-transform:  scaleX(-1);
}

#id_creation #done_sp_id {
margin: 0 auto 0 auto;
display: block;
border: black dotted 4px;
}

#id_creation div p {
margin:  10px 40px 10px 40px;
}

#id_creation div p i {
color:          lime;
}

#id_creation div p input {
margin:  0 auto 0 auto;
display: block;
}

#id_creation div p select {
margin-left: 20px;
}

#id_creation div h5 {
margin: 10px 0 5px 0;
}

#id_creation div #widget_bg {
padding:           0 0 0 0;
margin:            0 auto 20px auto;
overflow:          hidden;
background-repeat: no-repeat;
border:            black dotted 4px;
border-radius:     0px;
}

#id_creation div #widget_bg p {
margin:     0;
padding: 0;
background-color:   transparent;
border:             none;
}

#id_creation div .widget_normal {
width:             300px;
height:            63px;
}

#id_creation div .widget_large {
width:       600px;
height:      125px;
}

#feedback div {
z-index:       99;
position:      fixed;
left:          0;
top:           230px;
background-image: url(../images/menu/feedback.png);
height:        125px;
width:         34px;
display:       block;
}


#feedback div:hover {
opacity:      .30;
}


#game_over {
width:     450px;
margin:    0 auto 0 auto;
}

#game_over h3 {
color:     white;
text-align: center;
}

#game_over h4 {
color:     red;
text-align: center;
}

#game_over ul li b {
color:     red;
}

#game_over a {
margin:    0 auto 0 80px;

}

#game_over ul {
list-style: none;
margin-bottom: 0px;
padding-bottom: 0px;
}

#game_over ul li {
padding-left: 40px;
margin:       5px 0 5px 0;
background: url(../images/icons/doll.png) no-repeat left;
}

#game_over p {
color:        white;
}

#game_over p a {
margin:       0;
}

.link_appearance {
text-decoration:      underline;
color: lime;
}

.link_appearance:hover {
color: #1d5e12;
}

.information_table {
width:            100%;
color:            white; 
margin:           0 auto 0 auto;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
width: 964px;
padding: 10px;
margin-left: -50px;
}

#search_output_container {
background-color:      #353749;
background: rgba(53,55,73,0.90);
width: 960px;
border: black dotted 2px;
margin-left: -50px;
}

#script_container .information_table, 
#search_output_container .information_table{
margin-left: 0px;
width: 960px;
}

#search_output_container .pn_box {
margin: 5px;
}

.information_table tr {
background:       #0f123d;
border:           1px solid black;
border-radius:    25px;
}

.information_table tr th {
font-weight:      normal;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

.information_table tr th h3 {
font-size: 20px;
margin:    10px;
padding:   0px;
}

.information_table tr td {
border:             black dotted 3px;
background-color:   #282535;
}

.information_table tr td, .information_table tr th {
text-align:        center;
}

.information_table .special_info {
text-align:        left; 
padding:           0 14px 0 14px;
}

.information_table .image_box {
width:             50px;
height:            50px;
}

.information_table .object_info {
margin: 3px; 
padding: 0;
float: left;
border-radius: 15px;
background-color:   #22212a;
line-height: 20px;
width: 120px;
border: black dotted 2px;
font-size: 14px;
text-align: left;
}

.information_table .object_info img {
width: 20px; 
height: 20px;
float: left;
}


.directory_arrows {
margin:            0 20px 0 20px;
height:            55px;
}

.directory_arrows img {
border: none;
}

.directory_arrows img:hover {
opacity:           .50;
}

#intro_box {
width:             700px;
margin:            0 auto 0 auto;
}

#intro_box #persona_table {
margin: 0 auto 0 auto;
}

#intro_box #welcome_image {
border-radius:    15px;
background-color: black;
width:            600px;
margin:           15px auto 0 auto;
display: block;
}

#intro_box div span {
display:          none;
}

#intro_box p {
margin:           20px 60px 20px 60px;
padding:        15px;
border-radius:  10px;
background-color:      #353749;
border: black dotted 2px;
}

#collector_cat_list {
width: 300px;
padding: 15px;
margin: 50px 0 0 10px;
float: left;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#collector_cat_list h4 {
margin: 5px 0 5px 0;
padding: 0;
text-align: center;
font-size: 18px;
}

#collector_cat_list h6 {
font-size: 12px;
text-align: center;
margin: 5px 0 5px 0;
}

#collector_cat_list ul {
list-style: none;
background-color:   #282535;
border:             black dotted 2px;
margin: 0 0 0 0;
padding: 0;
}

#collector_cat_list ul li {
padding: 5px 0 0 10px;
color: #d4eee5;
text-decoration: underline;
-webkit-transition: color 1s ease;
transition:    color 1s ease;
}

#collector_cat_list ul li:hover {
color: yellow;
-webkit-transition: color 1s ease;
transition:    color 1s ease;
}

#collector_cat_list ul #selected_cat {
color: lime;
-webkit-transition: color 1s ease;
transition:    color 1s ease;
}

#collector_cat_list ul #selected_cat:hover {
color: yellow;
-webkit-transition: color 1s ease;
transition:    color 1s ease;
}

#creature_collector_panel {
width: 460px;
margin: 50px 0 0 10px;
float: left;
height: 600px;
padding: 15px 0 15px 0;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#creature_collector_panel div {
float:          left;
padding:        5px;
border-radius:  20px;
margin:         10px;
font-size:      14px;
min-width:      150px;
width:          194px; 
display:        block;
height:         80px;
text-align:     center;
background-color:   #2f2d3f;
border:             black dotted 2px;
color:             white;
}

#creature_collector_panel h6 {
text-align: center;
}

#creature_collector_panel div p {
padding: 5px;
text-align: left;
background-color:   #282535;
border:             black dotted 2px;
margin: 20px;
}

#creature_collector_panel .faded {
opacity: .50;
}

#creature_collector_panel div img {
width: 50px;
height: 50px;
float: right;
}

#creature_collector_panel div h4 {
margin: 7px 0 0 0;
line-height: 14px;
padding: 0px;
float: left;
max-width: 20ch;
text-overflow: ellipsis;
}

#creature_collector_panel div h4 a {
color: white;
}

#creature_collector_panel div p {
color: white;
float: left;
margin: 0;
padding: 0;
}

#creature_collector_panel #prev {
float: left;
width: 50px;
}

#creature_collector_panel #next {
float: right;
width: 50px;
}

#creature_collector_panel .direction {
-webkit-transition: opacity 1s ease;
transition:    opacity 1s ease;
}

#creature_collector_panel .direction:hover {
opacity: .50;
-webkit-transition: opacity 1s ease;
transition:    opacity 1s ease;
}

#collection_book, #war_book, #blood_book, #skill_book, #challenge_book, #gene_board, #comp_of_love, #fashion_handbook {
clear:      both;
}

#collection_book h5, #war_book h5, #blood_book h5, #skill_book h5, #challenge_book h5, #gene_board h5, #comp_of_love h5, #fashion_handbook h5 {
width:          783px;
height:         34px;
margin:         0px 0 0 20px;
padding:        0;
clear:          both;
border-radius:  0px;
box-shadow:     0px 0px 0px transparent;
border:         none;
text-align:     center;
color:          white;
font-size:      20px;
line-height:    50px;
}

#collection_book div, #war_book div, #blood_book div, #skill_book div, #challenge_book div, #gene_board div, #comp_of_love div, #fashion_handbook div {
width:  783px;
margin:  -20px 0 0 20px;
padding: 20px 0 15px 35px;
margin-bottom: 15px;
overflow: auto;
}

#fashion_handbook h5 {
background: transparent url(../images/special-backgrounds/book-top-p.png) no-repeat;
}

#fashion_handbook div {
background: transparent url(../images/special-backgrounds/book-mid-p.jpg) repeat-y;
width:  750px;
}

#fashion_handbook div div {
background: none;
width:  auto;
border: black solid 2px;
border-radius: 15px;
margin: 10px;
background: rgba(73,67,134,.65);
}

#fashion_handbook div div .outfit_img {
float: left;
width: 75px;
clear: both;
}

#fashion_handbook div div .skin_img {
float: left;
width: 20%;
}

#fashion_handbook div div p {
border: black solid 2px;
border-radius: 15px;
float: left;
width: 550px;
padding: 10px; 
background: rgba(67,75,134,.75);
}

#fashion_handbook div div p.full_width {
width: 626px;
}

#fashion_handbook div div p.skin_unlock {
width: 55%;
float: left;
}

#war_book h5 {
background: transparent url(../images/special-backgrounds/book-top-r.png) no-repeat;
}

#war_book div {
background: transparent url(../images/special-backgrounds/book-mid-r.jpg) repeat-y;
}

#collection_book h5 {
background: transparent url(../images/special-backgrounds/book-top-o.png) no-repeat;
}

#comp_of_love h5 {
color: black;
background: transparent url(../images/special-backgrounds/book-top-s.png) no-repeat;
}

#collection_book div {
background: transparent url(../images/special-backgrounds/book-mid-o.jpg) repeat-y;
}

#comp_of_love div {
background: transparent url(../images/special-backgrounds/book-mid-s.jpg) repeat-y;
}

#blood_book h5 {
background: transparent url(../images/special-backgrounds/book-top-b.png) no-repeat;
}

#blood_book div {
background: transparent url(../images/special-backgrounds/book-mid-b.jpg) repeat-y;
}

#gene_board h5 {
background: transparent url(../images/special-backgrounds/book-top-b.png) no-repeat;
}

#gene_board div {
background: transparent url(../images/special-backgrounds/book-mid-b.jpg) repeat-y;
}


#challenge_book h5 {
background: transparent url(../images/special-backgrounds/book-top-l.png) no-repeat;
}

#challenge_book div {
background: transparent url(../images/special-backgrounds/book-mid-l.jpg) repeat-y;
}

#skill_book h5 {
background: transparent url(../images/special-backgrounds/book-top-g.png) no-repeat;
}

#skill_book div {
background: transparent url(../images/special-backgrounds/book-mid-g.jpg) repeat-y;
width:  750px;
}

#comp_of_love div div h4 {
color: white;
background-color: #523744;
border-radius: 25px;
border: black solid 2px;
}

#comp_of_love div div {
width: 600px;
background: none;
height: 175px;
}

#comp_of_love div div img, #comp_of_love div div .math {
float: left;
transform: scaleX(-1); 
-webkit-transform: scaleX(-1);
}

#comp_of_love div div .math {
font-size: 100px;
color: black;
margin: 0 25px 0 25px;
}

#comp_of_love div.cumstain {
background: transparent url(../images/special-backgrounds/cum-stain.png) no-repeat;
	background-position: bottom left;

}

#comp_of_love div div .hint {
float: left;
border: black solid 2px;
color: black;
background-color: white;
border-radius: 25px;
padding: 10px;
margin-left: 40px;
margin-top: 40px;
width: 360px;
}

#comp_of_love div div .hint a {
color: blue;
}

#comp_of_love div .hint_options {
height: auto;
width: 550px;
padding: 0;
margin: 0;
background-color: #b75c84;
border: black solid 2px;
border-radius: 15px;
padding: 5px 0 5px 0px;
margin: 0px auto 0px auto;
}

#comp_of_love div .hint_options input {
margin-left: 25px;
}

#skill_display {
position: fixed;
display: none;
height: 300px;
width: 500px;
margin: 0px 0 0 150px;
overflow:auto;
}

#skill_display p {
background: #0f1739;
padding: 10px;
border-radius: 5px;
border: black solid 2px;
}

#skill_display table {
width: 100%;
text-align: center;
}

#skill_display table  th {
background: #0f1739;
}

#skill_display table  td {
background: #2b3860;
}

#book_completion div h3 {
font-size:      20px;
text-align: center;
position: absolute;
margin: -4px 0 0 220px;
z-index: 5;
}

#book_completion div {
height: 20px;   
position: relative;
background: #4e5262;
border-radius: 25px;
padding: 10px;
width: 550px;
margin: 0 auto 0 auto;
z-index: 4;
}

#book_completion div span {
display: block;
height: 100%;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
background-color: #1a8637;
}

#collection_book div div {
float:          left;
padding:        5px;
border-radius:  20px;
margin:         10px;
font-size:      14px;
min-width:      150px;
width:          140px; 
display:        block;
height:         80px;
text-align:     center;
background:     #918745;
color:          #fdf5c1;
border:         #b1a765 solid 2px;
}

#collection_book div div h4 {
margin: -4px 0 0 0;
line-height: 14px;
padding: 0px;
}

#collection_book div div h4 a {
color: white;
}

#collection_book div div h4 a:visited,
#collection_book div div h4 a:active  {
color: #fdf5c1;
}

#collection_book div div h4 a:hover {
color: #b8af77;
}

#collection_book div div .avatar {
width:  50px;
height: 50px;
border: none;
float: left;
margin-right: 5px;
}

#collection_book div div p {
width:         90px;
float:         left;
margin-top:        8px;
display:       block;
color:         #7a7241;
background:    #cdc8aa;
border-radius: 10px;
}


#skill_book div div {
background:     #225626;
border:         #599a5e solid 2px;
width:          210px;
height:         60px;
padding:        0 10px 0 10px;
margin:         10px 0px 0px 6px;
border-radius:  10px;
float: left;
}

#skill_book div div h4 {
margin: 5px; 
padding: 0;
}

#skill_book div div p {
background:     #307034;
border-radius: 5px;
margin: 0; 
padding: 0;
text-align: center;
}

#skill_book div div .unavailable {
background: #703030;
}

#skill_book div div .book_element {
float: left; 
}

#skill_book div div .examine {
float: right; 
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

#skill_book div div .examine:hover {
opacity: .50;
-webkit-transition: all 1s ease;
transition:    all 1s ease;
}

#blood_book div .faded, #collection_book .faded, #skill_book div .faded, 
#war_book div .faded, #challenge_book div .faded, #challenge_display .faded, #gene_board .faded {
opacity: .50;
}

#collection_book .faded {
background-color: #72996c;
border: black solid 2px;
}

#blood_book div div {
float:          left;
padding:        5px;
color:          black;
border-radius:  20px;
margin:         10px;
font-size:      14px;
height:         120px;
width:          300px;
padding:        10px;
background:     #a19f9f;
border: #6f6e6e solid 2px;
}

#blood_book div div h4 {
margin:         0px 0 2px 0;
padding:        0;
}

#blood_book div div h4 a {
color: black;
}

#blood_book div div p {
width:      200px; 
float:      left;
background: #d5d5d5;
border-radius: 5px;
margin: 1px;
padding: 1px;
}

#blood_book div div .avatar {
width:  65px;
height: 65px;
margin-left: 5px;
border: none;
}

#challenge_book div div {
padding:        5px;
color:          black;
border-radius:  20px;
margin:         10px;
background:     #22212a;
border:          #343546 solid 2px;
font-size:      14px;
color:          #b8c6e0;
min-height:     390px;
width:          90%;
}

#book_sort_order {
display: block;
float: left;
margin: 15px 0 0 220px;
position: absolute;
}

 #challenge_book div div h4 {
padding: 0;
margin: 0;
font-size: 16px;
}

#challenge_book div div .challenge_creature_box, #challenge_display table tr td .challenge_creature_box {
width:         100px;
min-height:    130px;
float:         left;
border:        2px solid black;
margin:        10px 3px 0 3px;
background:    #343546;
border-radius: 10px;
}

#challenge_book div div .challenge_creature_box h6, #challenge_display table tr td .challenge_creature_box h6 {
text-align:    center;
margin:        5px 5px 5px 5px;
font-size:     14px;
text-overflow:     ellipsis;
white-space:       nowrap;
overflow:          hidden;
-o-text-overflow:  ellipsis;  
}

#challenge_book div div .insufficient_level {
float:         left;
border:        2px solid black;
margin:        10px 5px 0 5px;
background:    #343546;
border-radius: 10px;
padding:       5px 8px 5px 8px;
width:         332px;
}

#challenge_book div div .insufficient_level b {
color: red;
}

#challenge_book div div ol {
float:         left;
border:        2px solid black;
margin:        10px 5px 0 5px;
background:    #343546;
border-radius: 10px;
padding:       5px 8px 5px 8px;
width:         332px;
font-size:     11px;
list-style:    none;

}

#challenge_book div div span img {
margin-bottom: -10px;
}

#challenge_book div div .menu {
min-height: 50px;
width: 332px;
float: left;
}

#challenge_book div div .menu .pn_box_link {
margin:     10px auto 0 auto;
width:      100px;
display:    block;
}

#challenge_book div div .effect_information {
float:         left;
width: 300px;
min-height:     100px;
}

#challenge_book div div .effect_information h3 {
font-size: 14px;
margin:    0;
padding:   0;
text-align: center;
}

#challenge_display {
box-shadow:      -5px 0px 3px black;
background:      #22212a;
border:          #343546 solid 2px;
padding:         20px;
}

#challenge_display table {
width: 100%;
}

#challenge_display table td {
text-align: center;
}

#challenge_display table tr td .challenge_creature_box {
width:         100px;
min-height:    130px;
margin-bottom: 15px;
}

#challenge_display table tr td .challenge_creature_box h6 {
}

#challenge_display table tr td ul {
font-size: 13px;
text-align: left;
list-style: none;
padding-left: 0;
margin-left: 7px;
}

#challenge_display table tr td ul li {
line-height: 30px;
}

#challenge_display table .ore_reward {
float: left;
margin-left: 35px;
padding: 10px;
border-radius: 15px;
border:            #132b54 solid 2px;
background-color:  #22212a;
color:             #becaea;
}

#challenge_display table .ore_reward img {
width: 25px;
height: 25px;
margin: 5px 5px -5px 5px;
}

#challenge_display .menu {
min-height:      60px;
width:           332px;
box-shadow:      -5px 0px 3px black;
background:      #22212a;
border:          #343546 solid 2px;
border-radius:   10px;
margin:          10px auto 0 auto;
}

#challenge_display .menu a {
width: 100px;
margin: 10px auto 0 auto;
display: block;
}
 
#challenge_options {
border:        2px solid black;
margin:        6px auto 6px auto;
background:    #343546;
border-radius: 10px;
padding:       5px 18px 5px 18px;
line-height:   35px;
width:         650px;
}

#challenge_options #spirit_display {
border:        2px solid black;
margin:        -30px 5px 0 5px;
background:    #2c457b;
border-radius: 10px;
width:         40px;
height:        80px;
float:         right;
}

#challenge_options #spirit_display img {
margin: 0 auto 0 auto;
display: block;
}

#challenge_options #spirit_display h6 {
margin: 0;
text-align: center;
}

#challenge_options #option_holder {
float: left;
margin-left: 10px;
}

#challenge_options h4 {
margin: 0;
}

#war_book div div, #gene_board div div {
float:          left;
padding:        5px;
color:          black;
border-radius:  20px;
margin:         10px;
background:     #280709;
border:          #6e272a solid 2px;
font-size:      14px;
color:          #fae3e5;
height:         220px;
width:          210px;
overflow:       auto;
}

#gene_board div div {
height:         90px;
background:     #757373;
border:         white solid 2px;
}

#war_book div div div, #gene_board div div div {
height:         70px;
width:          100%;
box-shadow:     none;
border:         none;
padding:        0px; 
margin:         0;
}

#gene_board div div div {
height:         70px;
}

#war_book div div h6, #gene_board div div h6 {
padding: 0px;
margin: 5px 0 0 0;
text-align: center;
}

#war_book div div p, #gene_board div div p {
padding: 0px;
margin: 0px;
}

#war_book div div h4, #gene_board div div h4 {
margin:         0px auto 5px auto;
text-align:     center;
}

#gene_board  .mutation_section {
float: left;
width: 70px;
}

#gene_board  .mutation_section img {
width: 50px;
}

#war_book input {
margin: -35px 0 10px 150px;
width: auto;
float: left;
}

#the_bedroom {
width:   826px;
height:  826px;
margin:  30px auto 10px auto;
border-radius:    15px;
background-repeat: no-repeat;
background-size: cover;
}

#bedroom_text_l p, #bedroom_text_r p, #bedroom_text_notice p, #bedroom_text_b p, #bedroom_text_c p {
margin-bottom: 5px;
}

#bedroom_text_l {
margin:       20px 0 0 20px;
position:     absolute;
}

#bedroom_text_r {
position:     absolute;
margin:       20px 0 0 425px;
}

#bedroom_text_notice {
margin:       325px 0 0 170px;
position:     absolute;
}

#bedroom_text_b {
margin:       600px 0 0 20px;
position:     absolute;
}

#bedroom_text_c {
margin:       600px 0 0 425px;
position:     absolute;
width: 330px;
}


#users_online_box table tr td .avatar {
width:        50px;
height:       50px;
border: none;
}

#users_online_box table tr td .mail {
float: right;
margin-top: 5px;
border: none;
}

#users_online_box table {
width:            90%;
text-align:       center;
border-bottom-left-radius:    15px;
border-bottom-right-radius:    15px;
margin: 0 5% 20px 5%;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#users_online_box table th {
background-color:   #282535;
border:             black dotted 2px;
}

#users_online_box h3, #users_online_box, h4 {
text-align: center;
}

#users_online_box h3 {
margin: -50px 0 0 300px;
position: absolute;
}

#map_box #magnifier {
position: absolute;
margin:   15px 0 0 640px;
}


/* Trade Menu */

.trade_box {
width:      500px;
margin:     25px auto 25px auto;
border-radius: 10px;
padding:       5px;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

.trade_box h4 {
margin: 5px;
}

.trade_box a {
color:    white;
border-radius: 10px;
padding: 5px;
text-decoration: none;
text-align: center;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

.trade_box .extended_a {
width: 400px;
display: block;
margin: 5px auto 5px auto;
}

.trade_box .exit_a {
width: 250px;
display: block;
margin: 25px auto 5px auto;
}

.trade_box p {
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
padding:   3px;
margin: 3px;
border-radius: 5px;
}

.trade_box a:hover {
border:            #4e4d5e dotted 3px;
background-color:   #5e5d70;
}

#enter_trade_information {
height:     200px;
overflow:   auto;
}

.trade_entries {
width:      500px;
margin:     25px auto 25px auto;
}

.trade_object {
margin:     5px auto 5px auto;
border-radius: 10px;
padding:    5px;
border:            #4e4d5e dotted 3px;
background-color:  #2c2b34;
}

.trade_object b {
color:      lime;
}

.trade_object div {
color:            white;
border:           #4e6fa7 solid 1px;
float:            right;
padding:          3px;
border:            black dotted 3px;
background-color:  #22212a;
}

.trade_object .deletion_button {
float:           left;
margin:         5px 10px 5px 5px;
}

#total_objects, #trade_options {
background-color:   #282535;
border:             black dotted 2px;
width: 100px;
margin: 0 auto 0 auto;
text-align: center;
}

#total_objects input {
background: none;
border: none;
width: 14px;
text-align: right;
color: white;
}

#trade_options {
width:    160px;
margin:   2px auto 2px auto;
opacity:  0;
}

.trade_box h5 {
margin: 5px;
clear: both;
text-align: center;
}

.trade_entry {
color:         white;
width:         230px;
height:        60px;
line-height:   40px;
margin:        5px 5px 5px 2px;
text-align:    center;
border-radius: 10px;
padding:       5px;
float:         left;
font-size: 14px;
background-color:   #282535;
border:             black dotted 2px;
}

.trade_entry h6 {
width:   100px;
padding: 0 0 0 0;
margin:  -10px auto 0 auto;
display: block;
}

.trade_entry img {
border-radius: 5px;
margin-top:    5px;
float:         right;
}

#lower_trade_information {
clear:         both;
}

#lower_trade_information a {
border-radius:     0;
background-color:   #282535;
border:             black dotted 2px;
color: white;
font-size:         14px;
padding:           2px;
-webkit-transition: none;
transition:    none;

}

#lower_trade_information a:hover {
color:             #22212a;
-webkit-transition: none;
transition:         none;
}

.trade_box #none_available {
color:       red;
width:       175px;
height:      35px;
line-height: 35px;
display:     block;
text-align:  center;
margin:      25px auto 0 auto;
}

#trade_entry_want_options, #trade_entry_offer_options {
display: none;
}

.trade_box #big_button {
margin: 15px auto 0 auto;
font-size: 20px;
display: block;
}

.trade_box #trade_description {
width: 98%;
}

#trade_list_box {
width: 800px;
}

#trade_list_box .arrow_box {
height: 26px;
width: 180px;
overflow: auto;

border-bottom-left-radius: 15px;
background-color:   #282535;
border:             black dotted 2px;
margin: 0 0 0 5px;
padding-top: 5px;
}

#trade_list_box .arrow_box img {
margin-left: 5px;
-webkit-transition:    opacity .5s ease;
transition:            opacity .5s ease;

}

#trade_list_box .arrow_box a {
background: none;
display: inline;
border: none;
margin: 0;
padding: 0;
}

#trade_list_box .arrow_box img:hover {
opacity: .25;
-webkit-transition:    opacity .5s ease;
transition:            opacity .5s ease;
}

#trade_list_box .tr_list_descrip {
overflow: auto;
}

#trade_list_box ol {
border-radius: 15px;
padding: 15px 0 15px 0;
}

#trade_list_box ol li {
margin: 5px 5px 0 30px;
}

#trade_list_box ol li .delete_button {
float: right;
}

#trade_list_box ol li textarea {
width: 96%;
max-width: 96%;
background-color:   #22212a;
padding: 5px;
}

#trade_list_box ol li p {
margin-top: 15px;
padding: 5px;
border: none;
}

#trade_list_box ol li img {
width: 30px;
}

#premium_reward {
min-height:        30px;
color:             white;
text-align:        center;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
padding:           2px 8px 2px 8px;
overflow:          auto;
width:         310px;
height:        215px;
margin:        0px 5px 0 5px;
border-radius: 10px;
float: left;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#premium_reward h3 {
margin: 5px 0 0 0;
padding: 0;
font-size: 16px;
background-color:   #282535;
border:             black dotted 2px;
}

#premium_reward .left_icon {
width: 30px;
float: left;
margin-right: 5px;
}

#premium_reward #next_period {
display: none;
}

#premium_reward ul {
list-style: none;
padding: 0 0 0px 0;
text-align: left;
}

#premium_reward ul li {
margin: 15px 0 15px 0;
font-size: 14px;
min-height: 30px;
border-radius: 10px;
background-color:   #282535;
border:             black dotted 2px;
}

#premium_reward ul li i,
.promotion-info ul li i {
text-align: right;
display: block;
clear: right;
}

#premium_reward ul li i.mult,
.promotion-info ul li i.mult {
color: lime;
}

#premium_reward ul li i.one,
.promotion-info ul li i.one {
color: yellow;
}

#premium_reward ul li h4 {
margin: 0;
padding: 0;
color: yellow;
}

#payment_reward_message {
width:         470px;
padding-bottom: 10px;
float:          left;
border:        2px solid black;
margin:        0px 5px 5px 5px;
background:    #343546;
}

#payment_reward_message p {
padding: 5px;
margin: 5px;
background-color: #282535;
width:           436px;
}

#payment_reward_message p a {
font-size: 20px;
}

#payment_reward_message p b {
color: yellow;
font-size: 20px;
}

#payment_reward_message h3 {
text-align: center;
margin: 0;
padding: 0;
font-size: 18px;
}

#credit_purchase_block {
margin:        0px 5px 0 5px;
border-radius: 10px;
width:         470px;
padding-bottom: 10px;
float:          left;
min-height:        215px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;

}


#credit_purchase_block #buy_menu {
margin: 10px 0 0 10px;
min-height: 70px;
float: left;
padding:         10px;
width:            420px;
}

#credit_purchase_block #buy_menu, #credit_purchase_block #order_option {
color:           white;
font-weight:     normal;
background-color:   #282535;
border:             black dotted 2px;
float: left;
}

#credit_purchase_block #order_option {
float: left;
margin: 10px 0 0 10px;
min-height: 70px;
padding:         10px;
width:           420px;
}

#credit_purchase_block #payment_button {
display: block;
margin: 15px auto 15px auto;
}

#credit_purchase_block p {
margin: 10px;
}

#credit_purchase_block #address_info {
border-radius: 10px;
border: black solid 2px;padding: 15px;
background: #282535;
}


#payment_processor_links {
margin: 8px auto 5px auto;
display: block;
height: 30px;
}

#payment_processor_links h5 {
float: left;
margin: 0px 0 0 225px;
line-height: 25px;
}

#payment_processor_links a {
margin-left: 5px;
}

#payment_processor_links a img {
border-radius: 15px;
border: #9ba5ef solid 4px;
height: 20px;
-webkit-transition:    all 2s ease;
transition:            all 2s ease;
}

#payment_processor_links a img:hover {
border: red solid 4px;
-webkit-transition:    all 2s ease;
transition:            all 2s ease;
opacity: .80;
}

#payment_limit {
margin: 0; 
padding: 0;
text-align: center;
}

#current_processor img {
border-radius: 15px;
border: #9ba5ef solid 4px;
height: 40px;
margin: 0 auto 0 auto;
display: block;
}

#reward_display_box {
margin:        10px 5px 0 5px;
border-radius: 10px;
background-color:      #353749;
border: black dotted 2px;
}

#reward_display_box h4, #credit_purchase_block h4 {
text-align:      center; 
color:           white;
font-weight:     normal;
padding:         5px;
border-radius:   10px;
margin:          10px auto 10px auto;
background-color:   #282535;
border:             black dotted 2px;
}

#credit_purchase_block h4 {
width:           300px;
}

#reward_display_box h4 {
width:           540px;
margin-left:    70px;
}

#reward_display_box #eva_box {
background-repeat: no-repeat;
background-position: right bottom; 
min-height: 370px;
padding-bottom: 25px;
}

#reward_display_box ul {
list-style:    none;
margin: 0; 
}

#reward_display_box ul li {
margin: 10px; 
width: 550px;
padding: 5px;
}
 
#reward_display_box ul li .premium_preview_sprite {
width: 30px; 
height: 30px; 
margin: 2px;
}

#reward_display_box p {
padding: 20px;
width: 550px;
}

#payment_policies_notice {
text-align: center;
margin:     5px auto 5px auto;
clear: both;
}

#recapcha_box {
width: 400px;
margin: 15px auto 15px auto;
padding: 15px;
border-radius: 15px;
background-color: #101f48;
border:  #040813 solid 2px;
}

#recapcha_box div {
margin: 0 auto 0 auto;
}

#recapcha_box input {
clear: both;
margin: 20px 0 0px 130px;
}

#mobile_quick_actions {
width: 776px;
min-height: 205px;
margin: 25px auto 25px auto;
border-radius: 20px;

background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#mobile_quick_actions #quick_display_options {
background-color:   #282535;
border:             black dotted 2px;
color: white;
margin: 5px auto 5px auto;
padding: 2px 6px 2px 6px;
}

#mobile_quick_actions #quick_button_list {
clear: both;
}

#mobile_quick_actions #alert {
width: 100%;
margin-left: 0;
}

#mobile_quick_actions h2 {
color: white;
text-align: center;
}

#mobile_quick_actions h4 {
color: white;
text-align: left;
}

.quick_button_container {
width: 155px;
float: left;
}

.quick_button_container h5 img {
margin-left: 10px;
}


.quick_button_container .preference_option {
float: left;
}

.quick_button, .faded_quick_button {
float: left;
width: 115px;
height:115px;
margin: 5px;
padding: 10px;
border-radius: 20px;
transition:      all 0.3s ease;
border:            black dotted 3px;
background-color:  #2f2d3f;
}

.quick_button:hover {
transition:      all 0.3s ease;
background-color: #391111;
}

.quick_button img, .faded_quick_button img {
margin: 0 auto 0 auto;
width: 30px;
display: block;
}

.quick_button p, .faded_quick_button p {
color: white;
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
border-radius: 15px;
}

.faded_quick_button {
background:       rgba(57,17,17,0.75);
}

.faded_quick_button p, .faded_quick_button img {
}

.faded_quick_button .unavailable {
position: absolute;
color: aqua;
width: 120px;
font-size: 14px;
border-radius: 15px;
padding: 0px 2px 0px 2px;
margin: -5px 0 0 -5px;
background-color: black;
z-index: 5;
}

.faded_quick_button .unavailable p {
background: none;
border: none;
margin: 0 0 0 0;
}

.faded_quick_button .unavailable p b {
color: lime;
}

.faded_quick_button .unavailable ul {
margin-top: 0;
padding-top: 0;
}

#quick_actions_results {
background-color: #2f2d3f;
border: black dotted 2px;
clear: both;
position: absolute;
margin: 5px;
width: 760px;
max-height: 350px;
overflow: auto;
display: none;
z-index: 6;
position: relative;
}

#quick_actions_results h3, 
#quick_actions_results h4 {
color: white;
padding-left: 15px;
}

#quick_actions_results p {
padding: 15px;
color: white;
background-color:   #282535;
border:             black dotted 2px;
margin: 1%;
}

#quick_actions_results ul {
color: white;
background-color:   #282535;
border:             black dotted 2px;
margin: 1%;
}

#quick_actions_results #quick_preset_breed li {
background-color:   #22212a;
border:     #4e4d5e dotted 2px;
background: rgba(34,34,42,0.90);
margin: 10px 5px 10px 5px;
padding: 10px;
}

#quick_action_options {
padding: 2px;
background-color:   #282535;
border:             black dotted 2px;
}

#quick_actions_results .exact_trades_m {
opacity: 1;
}

#quick_actions_results .close_trades_m {
opacity: 1;
}

#quick_actions_results .partial_trades_m {
opacity: 1;
}

#quick_actions_results #quick_action_options .pn_box {
text-transform: uppercase;
}

#bubble_1 {
position: absolute; 
margin: 14px  0 0 110px;
}

#bubble_2 {
position: absolute; 
margin: 162px 0 0 110px;
}

#bubble_3 {
position: absolute; 
margin: 308px 0 0 110px;
}

#bubble_4 {
position: absolute; 
margin: 444px 130px 0 -30px; 
}

#en_bubble_1 {
position: absolute; 
margin: 14px  0 0 780px;
}

#en_bubble_2 {
position: absolute; 
margin: 162px 0 0 780px;
}

#en_bubble_3 {
position: absolute; 
margin: 308px 0 0 780px;
}


#gift_code_box {
background: url(/images/main/gift-code-bg.png) transparent;
background-position: center; 
background-repeat: no-repeat;
padding: 30px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
}

#gift_code_box h2 {
text-align: center;
text-shadow: 2px 2px #000000;
}

#gift_code_box div {
border-radius: 15px;
width: 300px;
margin: 0 auto 0 auto;
padding: 25px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 3px;

}

#gift_code_box div p {
border-radius: 15px;
background-color:   #282535;
border:             black dotted 3px;
padding: 15px;
}

#gift_code_box div input {
margin-left: 10px;
}

/* Support Reward Page */

#support_rewards {
border-radius: 20px;
margin: 10px 20px 10px 20px;
padding: 20px;
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
}

#support_rewards h2 {
background-color:   #282535;
border:             black dotted 2px;
}

#support_rewards ul {
list-style: none;
margin: 0;
padding: 0;
}

#support_rewards ul li {
background-color:   #282535;
border:             black dotted 2px;
border-radius: 15px;
padding: 5px 10px 5px 10px;
margin: 10px 0 10px 0;
}

#support_rewards ul li h3 {
}

#support_rewards ul li h4 {
text-align: left;
line-height: 50px;
}

#support_rewards ul li h4 img {
width: 50px;
float: left;
margin-right: 20px;
}

#support_rewards ul li p {
padding: 10px;
clear: both;
background-color:   #22212a;
border:     #4e4d5e dotted 2px;
background: rgba(34,34,42,0.90);
}

#support_rewards ul li p .reward_claim_button {
padding: 5px;
text-decoration: none;
margin: 5px;
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
}

#support_rewards ul li p .reward_claim_button:hover {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#stretch_display_box #breeding_presets_div {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
width: 90%;
margin: 2.5% 5% 2.5% 5%;
}

#stretch_display_box #breeding_presets_div table {
margin: 2.5% auto 2.5% auto;
width: 90%;
}

#stretch_display_box #breeding_presets_div table tr .delete {
width: 50px;
}

#stretch_display_box #breeding_presets_div table tr .delete:hover {
opacity: .50;
}

#stretch_display_box #breeding_presets_div table th {
background-color:   #282535;
border:             black dotted 2px;
}

#stretch_display_box #breeding_presets_div table tr.type_1 {
border:            #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#stretch_display_box #breeding_presets_div table tr.type_2 {
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
}

#stretch_display_box #breeding_presets_div table td.sprite {
background-color:   #22212a;
border:     #4e4d5e dotted 2px;
background: rgba(34,34,42,0.90);
}

#stretch_display_box #breeding_presets_div table td.sprite img {
margin: 0 auto 0 auto;
display: block;
width: 125px;
}

#stretch_display_box #breeding_presets_div table td.item {
background-color:   #282535;
border:             black dotted 2px;
padding: 5px;
}

#stretch_display_box #breeding_presets_div table td.item img {
width: 30px;
}

#stretch_display_box #player_activity_list {
margin: 15px 35px 15px 35px;
padding: 15px 0 15px 0;
}

#stretch_display_box #player_activity_list h3 {
text-align: center;
padding-bottom: 10px;
margin: 0;
}

#stretch_display_box #player_activity_list table {
background-color:      #353749;
margin: 0 auto 0 auto;
border: black solid 2px;
padding: 30px;
border-radius: 15px;
width: 750px;
}

#stretch_display_box #player_activity_list table th {
background-color: #22212a;
text-align: center;
}

#stretch_display_box #player_activity_list .underline {
text-decoration: underline;
color: tan;
}

#stretch_display_box #player_activity_list table td,
#stretch_display_box #player_activity_list table th {
text-align: center;
border-bottom: black solid 2px;
}

#stretch_display_box #player_activity_list table td .complete_color {
color: lime;
}


#stretch_display_box #player_activity_list table td .pending_color {
color: orange;
}

/* Begin Battle Animations */
.creature_holder_r .shrinking_sickness,
.creature_holder_r .growing_sickness,
.creature_holder_r .item_gain,
.creature_holder_r .egg_gain,
.creature_holder_r .message_display,
.creature_holder_r .battle_ability_display,
.creature_holder_r .ep_damage_display, 
.creature_holder_r .hp_damage_display,
.creature_holder_l .shrinking_sickness,
.creature_holder_l .growing_sickness,
.creature_holder_l .message_display,
.creature_holder_l .battle_ability_display,
.creature_holder_l .ep_damage_display, 
.creature_holder_l .hp_damage_display {
font-size: 20px;
padding: 3px;
border-radius: 5px;
}


.battle_ability_display {
background-color: #724499;
background:      rgba(114,68,153,0.7);
border: black solid 2px;
position: absolute;
padding: 5px;
border-radius: 15px;
animation-name: mov_ability_display;
animation-duration: 4s;
opacity: 0;
}

.message_display {
color:           #514666;
background:      rgba(81,70,102,0.7);
position: absolute;
animation-name: damage_display;
animation-duration: 4s;
opacity: 0;
color: white;
}

.hp_damage_display {
color:           #609944;
background:      rgba(96,153,68,0.7);
position: absolute;
animation-name: damage_display;
animation-duration: 4s;
opacity: 0;
color: white;
}

.ep_damage_display {
color:           #999444;
background:      rgba(153,148,68,0.7);
position: absolute;
animation-name: damage_display;
animation-duration: 4s;
opacity: 0;
color: white;
}

.growing_buff, .growing_sickness, .growing_revive, .item_gain, .egg_gain {
position: absolute;
animation-name: grow_icon;
animation-duration: 2.5s;
opacity: 0;
padding: 6px;
border-radius: 35px;
background-color: #58a9ba;
}

.growing_sickness {
background-color: #ba5858;
}

.item_gain {
background-color: #bab258;
}

.egg_gain {
background-color: #3b8d3b;
}

.shrinking_debuff, .shrinking_sickness {
position: absolute;
animation-name: shrink_icon;
animation-duration: 2.5s;
opacity: 0;
padding: 6px;
border-radius: 35px;
background-color: #ba5858;
}

.shrinking_sickness {
background-color: #58a9ba;
}

.dodge_effect {
opacity: 0;
animation-name: fadeout;
animation-duration: 1s;
position: absolute;
}

.block_effect {
opacity: 0;
animation-name: fadeout;
animation-duration: 1s;
position: absolute;
}

.miss_effect {
opacity: 0;
animation-name: miss_fadeout;
animation-duration: 1s;
position: absolute;
}

.critical_effect {
opacity: 0;
animation-name: moving_strike;
animation-duration: 1s;
position: absolute;
width: 50px;
}

.element_effect {
opacity: 0;
animation-name: moving_element;
animation-duration: 1s;
position: absolute;
width: 50px;
}

.bad_effect {
opacity: 0;
animation-name: fadeout;
animation-duration: 3s;
animation-timing-function: ease-out;
position: absolute;
width: 100px;
height: 100px;
}

.first_appear, .going_out {
width: 100px;
height: 100px;
position: absolute;
opacity: 0;
}

.first_appear {
animation-name: fading_in_awhile;
animation-duration: 6s;
animation-timing-function: ease-out;
}

.going_out  {
animation-name: fading_out;
animation-duration: 3s;
animation-timing-function: ease-out;
}

@keyframes fading_in_awhile {
0%   {opacity: 0;}
5%   {opacity: 1;}
100% {opacity: 0;}
}

@keyframes fading_out {
0% {opacity: 1;}
50% {opacity: 1;}
100% {opacity: 0;}
}

@keyframes grow_icon {
from {width: 0px; height: 0px; opacity: 1;}
to {width: 100px; height: 100px; opacity: 0;}
}

@keyframes shrink_icon {
from {width: 100px; height: 100px; opacity: 1;}
to {width: 0px; height: 0px; opacity: 0;}
}

@keyframes mov_ability_display {
from {margin-left: 25px; opacity: 1;}
to {margin-left: 0px; opacity: 0;}
}

@keyframes damage_display {
0% {margin-left: 0; margin-top: 0; opacity: 1;}
100% {margin-left: 25px; margin-top: 25px; opacity: 0;}
}

@keyframes moving_strike {
0%   {opacity: 0; width: 25px; height: 10px;}
100% {opacity: 1; width: 100px; height: 41px;}
}

@keyframes moving_element {
0%   {opacity: 0; width: 25px; height: 25px;}
100% {opacity: 1; width: 100px; height: 100px;}
}


@keyframes hp_flash {
0%     {color: #ff9b9b;}
50%    {color: #38ff29;}
100%   {color: white;}
}

@keyframes ep_flash {
0%    {color: #ff9b9b;}
50%   {color: #ffed29;}
100%  {color: white;}
}

@keyframes fadeout {
0%   {opacity: 1;}
100% {opacity: 0;}
}

@keyframes reappear_fadein {
0%   {opacity: 0;}
100% {opacity: 1;}
}

@keyframes miss_fadeout {
0%   {opacity: 1; margin-top: 0; }
100% {opacity: 0; margin-top: 50px;}
}

@keyframes drop_and_fade {
0%   {margin-bottom: 0px;}
50%  {opacity: 1;}
100% {margin-bottom: -30px; opacity: 0;}
}

@keyframes step_right {
0%   {margin-left: 0px;}
100% {margin-left: 100px;}
}

@keyframes step_left {
0%   {margin-left: 0px;}
100% {margin-left: -100px;}
}

@keyframes back_right {
0%   {margin-left: -100px; transform: scaleX(-1); -webkit-transform: scaleX(-1);}
100% {margin-left: 0px; transform: none; -webkit-transform: none;}
}

@keyframes back_left {
0%   {margin-left: 100px; transform: none; -webkit-transform: none;}
100% {margin-left: 0px; transform: scaleX(-1); -webkit-transform: scaleX(-1);}
}

@keyframes dummy {
}

/*End Battle Animations*/

/* Scene Maker */

#scene_maker {
width:                      1000px;
margin: 0 auto 0 auto;
color: white;
background-image: url("/images/main/puppet-silhouette.png");
background-color: #402f44;
background-size: 50%;
border-bottom-right-radius:    15px;
border-bottom-left-radius:     15px;
border: black dotted 2px;
}

#scene_maker #banner .pn_logo {
margin-left: -185px;
border: none;
margin-top: 15px;
}

#scene_maker #top_menu {
margin-left: 70px;
}

#scene_maker h2, #scene_maker h3, #scene_maker h4, #scene_maker h5 {
text-align: center;
color: white;
padding: 10px 0 5px 0;
margin: 0 0 0 0;
}

h2#scene_header {
margin: 10px auto 10px auto;
border-radius:  15px;
border: black dotted 2px;
background-color: #2f2d3f;
width: 80%;
}

#scene_bg {
height: 585px; 
width: 780px; 
position: relative;
overflow: hidden;
background-repeat: no-repeat;
float: left;
border: black dotted 2px;
margin: 0 0  0px 10px;
padding: 0;
background-size: contain;
}

#black_stage #scene_bg {
float: none;
margin: 0 auto 0 auto;
border-radius: 5px;
background-color: black;
}

#scene_bg .unclickable_object {
pointer-events: none;
}

#scene_bg .object,
#scene_bg .unclickable_object  {
padding: 0 0 0 0; 
margin: 0 0 0 0; 
position: absolute;
}

#scene_bg .object img,
#scene_bg .unclickable_object img {
width: 100%;
height: 100%;
padding: 0 0 0 0; 
margin: 0 0 0 0; 
}

#scene_bg .object p,
#scene_bg .unclickable_object p {
padding: 0 0 0 0; 
margin: 0 0 0 0; 
text-align: left;
position: absolute;
pointer-events: none;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
display: block;
height: 50px;
}

#scene_maker #scene_options {
background-color: #353749;
background:       rgba(53,55,73,0.90);
float: left;
border: black dotted 2px;
margin: 0;
padding: 0;
}

#scene_maker #scene_options.vertical {
width: 192px;
height: 588px; 
border-top: none;
border-bottom: none;
border-left: none;
}

#scene_maker #scene_options.horizontal,
#scene_maker #scene_options.bottom_horizontal  {
width: 974px;
margin-left: 10px; 
}

#scene_maker #scene_options.horizontal {
border-bottom: none;
height: 104px;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}

#scene_maker #scene_options.bottom_horizontal {
clear: both;
float: none;
height: auto;
overflow: auto;
border-top: none;
margin-bottom: 15px;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
}

#scene_maker #scene_options.bottom_horizontal #navigation_options {
margin: 0 0 0 245px;
padding-top: 13px;
display: block;
}

#scene_maker #scene_options.bottom_horizontal #navigation_options a,
#scene_maker #scene_options.bottom_horizontal #navigation_options input {
text-decoration: none;
padding: 3px;
margin-left: 10px;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu {
height: auto;
float: none;
padding: 10px;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu h4 {
margin: 0;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container {
background-color: #22212a;
border-radius: 10px;
padding: 10px;
overflow: auto;
float: none;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .timeline_option,
#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .active_timeline_option {
float: left;
text-decoration: underline;
float: left;
text-align: center;
width: 90px;
border:            #4e4d5e dotted 2px;
background-color:  #2c2b34;
color: white;
padding: 0 5px 0 5px;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .timeline_option a,
#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .active_timeline_option a {
display: block;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #time_frame_sub_menu p {
background-color:   #282535;
border:             black dotted 2px;
border-radius:      15px;
padding: 5px;
margin: 10px 10px 10px 10px;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #time_frame_sub_menu ul {
padding: 0;
margin: 0;
clear: both;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #time_frame_sub_menu ul li {
float: left;
margin: 5px 5px 5px 5px;
padding: 0;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .timeline_option:hover {
border:             #4e4d5e dotted 2px;
background-color:   #5e5d70;
}

#scene_maker #scene_options.bottom_horizontal #timeline_menu #timeline_container .active_timeline_option {
border:             red dotted 2px;
background-color:   #5e5d70;
}

#scene_maker #scene_options.horizontal div {
float: left;
}

#scene_maker #scene_options.horizontal #loading_object_options {
z-index: 100;
}

#scene_maker #scene_options.horizontal .rotate_text {
transform: rotate(270deg);
font-size: 14px;
white-space: nowrap;
width: 35px;
padding: 0;
margin: 0;
margin-top: 40px;
}

#scene_maker #scene_options  .user_help {
font-size: 20px;
padding: 10px;
}

#scene_maker #scene_options ul {
list-style: none;
margin: 0;
padding: 10px;
}

#scene_maker #scene_options li {
margin: 0;
padding: 0;
}

#scene_maker #scene_options table {
width: 190px;
}

#scene_maker #scene_options #selected_object_options table th {
white-space: nowrap;
font-size: 14px;
}

#scene_maker #loading_object_options {
background-color: #22212a;
margin-left: 30px;
}

#scene_maker #scene_options.vertical select {
max-width: 100px;
}

#scene_maker #scene_options.horizontal select {
width: 180px;
}

#scene_maker #scene_options input {
max-width: 100px;
}

#scene_maker #scene_options .pn_box#remove_button {
max-width: 180px;
border-color: red;
margin: 15px 5px 15px 5px;
}

#scene_maker #scene_options textarea {
height: 100px;
max-height: 100px;
width: 175px;
max-width: 175px;
}

#scene_maker #scene_options.horizontal #easy_select_options {
float: right;
background-color: #22212a;
padding: 5px 5px 14px 5px;
width: 240px;
}

#scene_maker #scene_options .pn_box#object_selector {
max-width: 180px;
display: block;
margin: 0 auto 0 5px;
float: left;
}

#scene_maker #scene_options #object_total_div {
float: left;
margin: 0 auto 0 10px;
}

#scene_maker #scene_options #object_total_div input {
background-color: transparent;
width: 15px;
border: none;
color: white;
}

#scene_maker #scene_options.horizontal #general_scene_options input,
#scene_maker #scene_options.horizontal #general_scene_options select {
max-width: 180px;
width: 180px;
}

/* Player Scene Viewer */

#scene_maker #scene_list {
background-color:      #353749;
background: rgba(53,55,73,0.90);
border: black dotted 2px;
overflow: auto;
margin: 30px;
}

#scene_maker #scene_list .preview_container {
width: auto;
float: left;
margin-bottom: 10px;
}

#scene_maker #scene_list .preview_container .scene_bg_preview {
width: 150px;
height: 113px;
border: black dotted 4px;
margin: 10px 10px 10px 10px;
background-size: contain;
background-repeat: no-repeat;
transition:      all 0.3s ease;
}

#scene_maker #scene_list .preview_container .scene_bg_preview b {
color: yellow;
}

#scene_maker #scene_list .preview_container .scene_bg_preview:hover {
border-color: #f5eca2;
transition:      all 0.3s ease;
opacity: .80;
}

#scene_maker #scene_list .preview_container .scene_bg_preview h4 {
font-size: 16px;
margin: 30px 3px 0 3px;
    text-shadow:
    -1px -1px 0 #000,
    1px -1px 0 #000,
    -1px 1px 0 #000,
    1px 1px 0 #000; 
}

#scene_maker #scene_list .preview_container a {
text-decoration: none;
width: 100%;
height: 100%;
display: block;
}

#scene_maker #scene_list .preview_container .preview_options {
margin-left: 25px;
display: block;
width: 150px;
}

#scene_maker #scene_list .preview_container .preview_options a {
display: inline;
height: auto;
width: auto;
padding: 0px 10px 0px 10px;
font-size: 14px;
}

#scene_maker #scene_list p.notice {
background-color:   #22212a;
border:     #4e4d5e dotted 2px;
background: rgba(34,34,42,0.90);
margin: 10px auto 10px auto;
padding: 5px;
width: 75%;
text-align: center;
border-radius: 15px;
}

#stretch_display_box #black_stage #scene_bg #play_button {
font-size: 50px;
color: white;
display: block;
width: 150px;
margin: 225px auto 0 auto;
white-space: nowrap;
}