﻿@import url(css/jquery-ui-1.7.2.custom.css);
@import url(css/flexigrid.css);
@import url(css/validationEngine.jquery.css);

html, body {
    height: 100%;
    width: 100%;
}

a.liveChat.offline, a.liveChat.offline:hover
{
    text-decoration: none!important;
}

body.chat {
    font-family:Verdana, Arial;
    font-size:12px;
    margin:0;
    overflow: hidden;
    padding:0;
}

div#tabs li 
{
    list-style: none!important;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear-left {
    clear: left;
}

.clear-right {
    clear: right;
}

.clear-both {
    clear: both;
}

a.newMessage {
    color: Red !important;
    font-style:italic !important;
}

#divTabs {
    height: 100%;
}

    a.tabClose {
        cursor: pointer!important;
        height: 16px !important;
        margin: 0.5em 0.75em 0 -0.5em !important;
        padding: 0 !important;
        text-indent: -999999px !important;
        width: 16px !important;   
    }

    #divTabPanes {
        height: 100%;
        padding-bottom: 10px;
    }
    
        div.messages 
		{
            background: #FFF;
            border: 1px solid;
            display: inline-block;
            height: 200px;
            overflow-y: auto;
            width: 400px;
        }
    
        div.message {
            margin: 0;
            padding:4px;
        }
    
        div.message.self {
            background: #F6F6F6;
        }
        
        div.message div.name {
            color: Blue;
            float: left;
            padding-right: 5px;
        }
        
        div.message.self div.name {
            color: Red;
        }
        
        div.message.system div.body {
            color: Green;
        }

#divInput,
.input {
    overflow: hidden !important;
}

#divInput textarea,
.textarea {
    border:none;
    height:100%;
    margin:0;
    padding:0;
    width:100%;
}
    
#divQuestions {
    
}
    span.label {
        display:inline-block;
        font-weight: bold;
        /*height:100%;*/
        vertical-align:top;
        width:85px;
    }
    
    #divQuestions span.label {
        font-weight: normal;
    }

    #txtFirstName,
    #txtLastName {
        width:150px;
    }

    #txtEmail {
        width:200px;
    }

    #txtQuestion {
        height:50px;
        width:200px;
    }

.notesContainer {
    overflow: auto !important;
}

    .notesContainer div 
    {
        margin-bottom: 10px;
    }

/*########################################################################*/
/* LAYOUT CONTAINERS */

.chatInterface {
    height: 85%!important;
}

    .transcript
    {
        overflow-y: auto!important;
    }
    
    .ui-layout-pane { /* all 'panes' */ 
		padding:		10px; 
		background:		#FFF; 
		border-top:		1px solid #BBB;
		border-bottom:	1px solid #BBB;
		overflow:		hidden;
		}
		.ui-layout-pane-north ,
		.ui-layout-pane-south {
			border: 1px solid #BBB;
		} 
		.ui-layout-pane-west {
			border-left: 1px solid #BBB;
		} 
		.ui-layout-pane-east {
			border-right: 1px solid #BBB;
		} 
		.ui-layout-pane-center {
			border-left:  0;
			border-right: 0;
			} 
			.inner-center {
				border: 1px solid #BBB;
			} 
 
	.ui-layout-resizer { /* all 'resizer-bars' */ 
		background: #DDD; 
		}
		.ui-layout-resizer:hover { /* all 'resizer-bars' */ 
			background: #FED; 
		}
		.ui-layout-resizer-south {
			border-left: 1px solid #BBB;
			width: 100%!important;
		}
		.ui-layout-resizer-east {
			border-right: 1px solid #BBB;
		}
 
	.ui-layout-toggler { /* all 'toggler-buttons' */ 
		background: #AAA; 
		} 
		.ui-layout-toggler:hover { /* all 'toggler-buttons' */ 
			background: #FC3; 
		} 
 
	.outer-center {
		/* center pane that are 'containers' for a nested layout */ 
		padding: 0; 
		border: 0; 
	} 