/* xxxxxxxxxxxxxxxxxxxxxxxxx POPUPS MESSAGES xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

/* This file basically overwrites the css of the standard jQuery dialog box to create a custom look for my dialog box */

div#show_page_message{                                                  /* My container within the main container class */
        display         : none;
        position        : fixed;
        border-radius   : 10px;
        z-index         : 9000000;                                      /* Ninety lakh */    
        padding         : 10px 10px 10px 10px;
        overflow        : auto;
}

div#show_page_message input[type=submit]{
        margin          : 10px;
}

div#show_page_message_top_div, div#show_page_message_mid_div, div#show_page_message_bottom_div{        /* Sub-sections within my container */
        width       : 100%;
        clear       : both;
        text-align  : center;
        font-family : Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
        color       : #ffffff;
        font-weight : bold;
}

div#show_page_message_top_div p, div#show_page_message_mid_div p, div#show_page_message_bottom_div p{
        clear           : both;
        font-size       : 18px;
        font-family     : Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
        color           : #ffffff;
        margin          : 10px;   
        font-weight     : bold;
}

div#show_page_message_top_div a, div#show_page_message_mid_div a, div#show_page_message_bottom_div a{    /* Sub-sections within my container */
        color           : #ffffff;
        font-size       : 16px;
}

div#show_page_message_top_div{                                          /* This one has the icon */
        font-size       : 32px;
        padding         : 10px 0px 0px 0px;
}

div#show_page_message_mid_div{                                       /* This one has the text including the header - Please Wait, Success, Error, etc */
        font-size       : 16px;
        letter-spacing  : 0.5px;
        font-family     : Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
}

div#show_page_message_mid_div h1{                                    /* This one has the header - Please Wait, Success, Error, etc */
        clear           : both;
        font-size       : 28px;
        font-family     : Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
        color           : #ffffff;
        margin          : 20px;
}

/* xxxx WAIT MESSAGE xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

.show_page_message_wait{
        /*background-color    : #50cffc;                   */
        /*border              : 10px solid #50cffc;        */
}

/* xxxx SUCCESS MESSAGE xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

.show_page_message_success{
        /*background-color    : #20da9b;                    */
        /*border              : 10px solid #20da9b;         */
}

.show_page_message_success i{
        color               : #36dfa6;
}

.show_page_message_success input[type=submit]{
        background-color    : #36dfa6;
        color               : #000000;
        font-weight         : bold;
}

/* xxxx ERROR MESSAGE xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

.show_page_message_error{
        /*background-color    : #f26051;                    */
        /*border              : 10px solid #f26051;         */
}

.show_page_message_error i{
        color               : #850e02;
        -webkit-text-stroke : 1px #ffffff;
}

.show_page_message_error input[type=submit]{
        background-color    : #850e02;
}

/* xxxx QUERY MESSAGE xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */

.show_page_message_query{
        /*background-color    : #ffc150;                */
        /*border              : 10px solid #ffc150;     */
}

.show_page_message_query input[type=submit]{
        background-color    : #ff7800;
}

.show_page_message_bottom_div_input_container{
        padding-top         : 20px;
        display             : inline-block;
}