html, document, body, head, tr, td, th, zk, a, p, div, ul, li
{
    font-family: Geneva,Tahoma,Verdana,sans-serif; 
}

html, document, body
{
    margin:0px !important;
    padding:0px !important;
}


html


.steps
{
    display:flex;
    justify-content: center;
    padding:32px 0px;

}


.steps .step
{
    text-align: center;
    font-size: 12px;
    width:32px;
    
}

.step_c1
{
    height: 24px;
    width: 24px;
    display:block;
    background-color:white;
    border-radius:16px;
    padding:4px;
}

.step_c2
{
    height: 20px;
    width: 20px;
    display:block;
    background-color:rgba(212,7,7,1);
    border-radius:12px;
    padding:2px;
}

.step_c2 div
{
    background-color: white;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    display:block;
    width:20px;
    height:20px;
    border-radius:10px;
}

.step_complete { background-image: url(images/icon_approve.png); }

.steps .step_bridge
{
    height:5px;
    width:64px;
    background-color:white;
    margin-top:13px;
}
.fl {float:left !important;}
.fr {float:right !important;}
.fn {float:none !important;}
.ma {margin:auto !important;}


.fs_10 {font-size:10px !important;}
.fs_12 {font-size:12px !important;}
.fs_14 {font-size:14px !important;}
.fs_16 {font-size:16px !important;}
.fs_18 {font-size:18px !important;}
.fs_20 {font-size:20px !important;}
.fs_22 {font-size:22px !important;}
.fs_24 {font-size:24px !important;}
.fs_26 {font-size:26px !important;}


.pd_h_8 {padding-left: 8px; padding-right:8px;}
.pd_h_10 {padding-left: 10px; padding-right:10px;}
.pd_h_12 {padding-left: 12px; padding-right:12px;}
.pd_h_14 {padding-left: 14px; padding-right:14px;}
.pd_h_16 {padding-left: 16px; padding-right:16px;}

.bm_6 {margin-bottom:6px !important;}
.bm_8 {margin-bottom:8px !important;}
.bm_10 {margin-bottom:10px !important;}
.bm_12 {margin-bottom:12px !important;}
.bm_14 {margin-bottom:14px !important;}
.bm_16 {margin-bottom:16px !important;}
.bm_18 {margin-bottom:18px !important;}

.ml_6 {margin-left:6px !important;}
.ml_8 {margin-left:8px !important;}
.ml_10 {margin-left:10px !important;}
.ml_12 {margin-left:12px !important;}
.ml_14 {margin-left:14px !important;}
.ml_16 {margin-left:16px !important;}
.ml_18 {margin-left:18px !important;}
.ml_20 {margin-left:20px !important;}
.ml_22 {margin-left:22px !important;}
.ml_24 {margin-left:24px !important;}

.mt_6 {margin-top:6px !important;}
.mt_8 {margin-top:8px !important;}
.mt_10 {margin-top:10px !important;}
.mt_12 {margin-top:12px !important;}
.mt_14 {margin-top:14px !important;}
.mt_16 {margin-top:16px !important;}
.mt_18 {margin-top:18px !important;}
.mt_20 {margin-top:20px !important;}
.mt_22 {margin-top:22px !important;}
.mt_24 {margin-top:24px !important;}


.wa {width:auto !important;}
.w100 {width:100% !important;}
.w90 {width:90% !important;}
.w80 {width:80% !important;}




.tac {text-align: center !important;}
.tal {text-align: left !important;}
.tar {text-align: right !important;}

.btn_red
{
    background: rgb(78,12,12);
    background: linear-gradient(0deg, rgba(78,12,12,1) 0%, rgba(212,7,7,1) 68%, rgba(255,7,0,1) 100%);
    color:white;
    text-decoration: none;
    line-height:32px;
    border-radius: 0px;
    border:1px solid #531818;
    display:block;
    text-align: center;
}


.btn_red:hover
{
    background: rgb(212,7,7);
    background: linear-gradient(0deg, rgba(212,7,7,1) 0%, rgba(255,7,7,1) 68%, rgba(255,0,0,1) 100%);
   
}

.btn_black
{
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 51%, rgba(41,41,41,1) 51%);
    color:white;
    text-decoration: none;
    line-height:38px;
    border-radius: 0px;
    display:block;
    text-align: center;
}

.btn_black:hover
{
    background: rgb(50,50,50);
}



.btn_header_login
{
    float:right;
    display:block;
    margin-top:14px;
    margin-right:16px;
}

.btn_header_logout
{
    float:right;
    display:block;
    margin-top:20px;
    margin-right:24px;
    line-height: 22px !important;
}

.header_frontend
{
    height:60px;
    display:block;
    width:100%;
    background-color:white;
}


.header_frontend .header_logo
{
    background-image: url(images/logo_w_432.png);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: contain;
    width: 200px;
    height: 40px;
    display:block;
    float:left;
    margin:10px;
    margin-left:16px;
}

.header_user
{
    height:60px;
    display:block;
    width:100%;
    background-color:white;
}

.btn_menu
{
    background-image: url(images/icon_menu.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 48px;
    height: 48px;
    display:block;
    margin:auto;
    position:absolute;
    top:30px;
    left:16px;
    margin-top:-24px;

    display:none;

}

.header_user .header_logo
{
    background-image: url(images/logo_w_432.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 120px;
    height: 40px;
    display:block;
    margin:auto;
    position:absolute;
    top:30px;
    left:180px;
    left:50%;
    margin-left:-60px;
    margin-top:-20px;
}



#menu_user
{
    width:150px;
    height:100%;
    background-color:white;
    position: absolute;
    left: 0px;
    border-right:1px solid rgb(59, 30, 30);
    border-top:1px solid rgb(59, 30, 30);


    
}

#menu_user a
{
    text-decoration: none;
    line-height:32px;
    text-align:left;
    color:black;
    text-indent: 28px;
    font-size:14px;
    display:block;
    border-bottom:1px solid #00000033;
    
}

#menu_user a:hover, #menu_user a:active
{
    background-color:#00000033;
    
}



#menu_user_horizontal
{
    display:flex;
    justify-content: center;
    width:100%;
    height:auto;
    background-color:white;


    
}

#menu_user_horizontal a
{
    text-decoration: none;
    line-height:32px;
    text-align:center;
    color:white;
    background-color:black;
    font-size:12px;
    display:block;
    width:25%;
    border:1px solid gray;
    border-top:0px;
    border-bottom:0px;
    
}

#menu_user_horizontal a:hover, #menu_user_horizontal a:active
{
    background-color:#2e2626;
    
}

.white_bg
{
    background: white;
}


.red_bg
{
    background: rgb(161,0,0);
    backgroundxx: linear-gradient(90deg, rgba(161,0,0,1) 0%, rgba(161,0,0,1) 6%, rgba(116,0,0,1) 6%, rgba(116,0,0,1) 94%, rgba(161,0,0,1) 94%, rgba(161,0,0,1) 100%);
}

.white_text
{
    color:white;
}

.title_text
{
    font-size: 23px;
    font-weight: bold;




}

.small_text
{
    font-size: 15px;
    font-weight: 100;
}

.content_center
{
    margin: 0px 40px;
    max-width: 460px;
    
}


.input_register
{
    font-size:15px;
    height:28px;
    line-height:28px;
    width:100%; 
    border:0px;
    padding:0px !important;
    text-indent:4px;
    min-width: 60px;
}

.input_application
{
    font-size:15px;
    height:28px;
    line-height:28px;
    width:100%; 
    border:1px solid #414141;
    padding:0px !important;
    text-indent:4px;
    min-width: 60px;
}


.footer
{
    color:white;
    text-align:center;
    font-size:16px;
    background-color:#202020;
    padding:16px 0px;
    display:none;
}

.footer .line
{
    width:90%;
    display:block;
    height:2px;
    margin:12px auto 0px auto;
    background-color:#e2e2e2;
}

html
{
    background-color:#202020;
}

.page_content
{
    min-height:530px;
}

#notification_area
{
    min-height:12px;
    display:block;
    background-color:rgba(161,0,0,1);

}


#notification_area a
{
    
    display:block;
    color: white;
    font-size:12px;
    text-align: center;
    text-decoration: none;
    line-height:24px;
}


.page_title_holder
{
    background-image: url(images/page_title_holder.jpg);
    width:100%;
    height:50px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin:16px auto;
    font-weight: bold;
    text-align: center;
    line-height: 44px;

}


.cutscene
{
    background-image: url(images/cutscene.jpg);
    height:90px;
    width:72px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
    
    color:rgb(160, 0, 0);
    font-weight: bold;
    font-size:12px;
}

.cutscene span
{
    display: block;
    margin: 0px;
    text-align: center;
    padding-top: 30px;
}

.gs_col
{
    display:flex;
    justify-content:center;
    flex-direction: column;
    float:left;
}

.gs_col div
{
    cursor:pointer;
}

.gs_col.c1
{
   margin-left:12px;
   width:72px;


}

.gs_col.c2
{
    padding-top:20px;
    margin-left:16px;
    width:32px;
}

.gs_col.c3
{
   float:none !important;
   margin-left:146px;
}



.gs_status
{
    background-image: url(images/icon_approve_disabled.png);
    height:32px;
    width:32px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
    display: block;
}

.gs_status.step_complete
{
    background-image: url(images/icon_approve.png);
}

.gs_status_bridge
{
    background-color:gray;
    height:58px;
    width:4px;
    display: block;
    margin-left:13px;

}

.gs_steps_desc
{
    height:66px;
    padding-top:24px;
    display:block;

    color:rgb(48, 17, 17);
    font-weight: bold;
    font-size:14px;
    vertical-align:middle;
    display: table-cell;
}


.conversation
{
    border-radius:3px;
    background-color:#ffd0d0;
    margin: 14px;
    display:block;
    padding:6px;


}
.conversation .profile
{
    font-weight:bold;
    font-size:14px;
    color:black;
    margin-bottom:8px;
}

.conversation .from
{
    font-weight:100;
    font-size:11px;
    color:rgb(67, 86, 172);
}

.conversation .msg
{
    font-weight:100;
    font-size:12px;
    font-style: italic;
}

.conversation .time
{
    font-weight:100;
    font-size:12px;
    color:rgb(97, 8, 8);
    margin-top:11px;
}


.photo_slot
{
    display:block;
    height:110px;
    width:150px;
    float:left;
    xmargin:0px;

}

.photo_slot .preview
{
    height:80px;
    width:150px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    display:block;
    background-image: url(images/np_photo.png);

}

.photo_slot .line
{
    margin:4px 2px;
    height:2px;
    display:block;
    background-color:gray;
}

.photo_slot .slot_title
{
    text-align:center;
    display:block;
    font-size:13px;
}

.hint
{
    font-size:12px;
}

.red_text {color:red !important;}
.blue_text {color:rgb(42, 27, 177) !important;}
.green_text {color:rgb(21, 150, 28) !important;}



.chat
{
    display:block;
    max-width:800px;
    margin:auto;
    overflow:auto;
    max-height:500px;
    padding:16px;


}
.clickable {cursor:pointer;}


.chatbox_user strong, .chatbox_admin strong
{
    margin-right:-4px;
    margin-left:-4px;
    margin-bottom:6px;
    font-size:14px;
}

.heard
{
    background-color:#808080 !important;
}

.chatbox_user
{
    background-color: #62b8fb;
    color:white;
    xborder:2px solid #070;
    font-weight:normal;
    float:right;
    border-radius:12px;
    padding:14px;
    display:block;
    text-align:left;
    font-family: "Raleway", sans-serif;
    max-width: 500px;

}


.chatbox_admin
{
    background-color:#b51919;
    xborder:2px solid rgb(78, 114, 148);
    color:#ffffff;
    float:left;
    padding:14px;
    border-radius:12px;
    font-weight:normal;
    font-family: "Raleway", sans-serif;
    display:block;
    text-align:left;
    max-width: 500px;
}

.msg_time
{
    margin-top:16px;
    font-size:10px;
    margin:auto;
    left:auto;
    right:auto;
}



textarea.chat
{
    height:58px;
    margin:6px auto;
    width:84%;
    display:block;

}

.chat_send
{
    width:140px;
}


.login_link
{
    float:right;
    font-size:13px;
    margin-right:18px;
    line-height:60px;
}

.red_soft_text
{
    text-decoration: none;
    font-size: 12px;
    color: #fbc6c6;
}



.pose
{
    cursor:pointer;
    display:block;
    height:100px;
    width:70px;
    border:4px solid #ededed;
    float:left;
    margin:12px 5px 0px 5px;

}
.pose_preview
{
    background-size:contain;
    background-position:top center;
    background-repeat:no-repeat;
    display:block;
    height:70px;
    width:70px;
    
}
.pose_title
{
    text-align:center;
    font-size:9px;
    color:#343434;
    display:block;
    border-top:1px solid gray;
}


.pose.selected
{
    border:4px solid #009a05;
}

#slots
{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-evenly;
    max-width:870px;
}


@media screen and (min-width: 361px)
{
    .content_center
    {
        margin: 0px auto;
        padding:0px 20px;
    }

    .pose_title
    {
        font-size:10px;
       
    }

}


*,
*::before,
*::after {
  box-sizing: inherit !important;
}