/* main css styles for deshana */


html.wait, html.wait * { cursor: wait !important; }

#title
{
    font-size: 24px;
    padding: 10px;
    color: darkgoldenrod;
    float: left;
}

#title_image
{
    width: 130px;
    height: 50px;
    margin: 0px 10px;
    float: left;
}

#main_menu
{
    float: right;
    font-weight: bold;
}

.menu_item
{
    float: right;
    padding: 5px;
    border: 1px solid;
    margin-left: 5px;
    cursor: pointer;
}

.menu_disabled
{
    color: lightgray;
    cursor: default;
}

#banner
{
    overflow: hidden;
    margin: -10px -10px 5px -10px;
    text-align: right;
    background-color: beige;
    padding: 5px 10px 2px 0px;
}

body {
    font-family: Arial, Tahoma, Geneva, Verdana;    
    background: #b6b7bc;
    font-size: .75em;
    color: #696969;
}

#page-container
{
    width: 90%;
    overflow: auto;
    height: auto;
    padding: 10px;
    margin: 0 auto;
    background-color: White;
    
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;    
    border-radius: 10px;
    border: 2px solid Gray;    
}

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   speak for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   absolute;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 0, 0, 0, 0.1 ) 
                url(../images/ajax-loader-2.gif) 
                50% 50% 
                no-repeat;
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}

/* Form input css */

.boxsizing-border {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
}

.form-label {
    float: left; 
    clear: left;
    margin: 5px 0px 0px 0px;
}

.form-input 
{
    float: left; 
    clear: left;
    padding: 2px;
    border: 1px solid #e0e0e0;
    background-color: #ffffcc;
}

.form-input-readonly 
{
    float: left; 
    clear: left;
    padding: 2px;
    border: 1px solid #b9bdc1;
}

.button {
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background-color:#f0f0f0;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
    border-radius:5px;
    border:1px solid #acacac;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-size:12px;
    font-weight:bold;
    padding:6px 12px;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;
}
.button:hover {
    background-color:#e9e9e9;
}
.button[disabled]:hover {
    background-color:#f0f0f0;
}
.button:active {
    position:relative;
    top:1px;
}
.button:disabled {
	color: lightgray;
	cursor: default;
}

.buttondis {
    color:#c9c9c9;
    cursor:default;
}
.buttondis:active {
    top:0px;
}
.buttondis:hover {
    background-color:#f9f9f9;
}

:focus, :active {
    outline: 0;
}

.alignRight { text-align: right; }
.alignCenter { text-align: center; }

.default_form
{
    padding: 20px;
    overflow: auto;
    background-color: beige;
    border-radius: 10px;
    border: 2px solid rgb(224, 224, 200);
}

.error
{
margin: 20px 0px 0px 0px;
padding: 0px;
color: red;
}

#logininfo
{
    float: right;
    padding: 5px 10px;
    border: 1px solid lightgray;
    color: grey;
    margin-left: 15px;
}

.button_image
{
    background-repeat: no-repeat;
    width: 34px;
    height: 34px;
    background-position-x: 0px;
    background-position-y: 0px;
}

.seperator
{
    padding: 1px 3px;
    vertical-align: bottom;
}

/* Instruction styles */

.instructions {
	display: none;
	float: left;
	background-color: beige;
}
.instructions ul {
	float: left;
	padding-left: 20px;
}
.instructions li {
	float: left;
}
.instructions-toggle {
	float: right;
	text-decoration: underline;
	color: #c55252;
	cursor: pointer;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}
