/* CSS Document */
header {
	background-color: #49afcd;
 	*background-color: #2f96b4;
  	background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
  	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5bc0de), to(#2f96b4));
 	background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
  	background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
  	background-image: linear-gradient(to bottom, #5bc0de, #2f96b4);
  	background-repeat: repeat-x;
	color:#FFF;
	margin-bottom:10px
}
header ul { margin-top:10px}
header a { color:#ddd}
header h3 { font-size:20px; margin:0}
footer { margin-top:30px}
footer .container { border-top:1px solid #dedede; padding-top:15px}

.box { border:1px solid #dedede; padding:10px; margin-top:25px; background:#f9f9f9; border-radius:5px}
.btn {margin-right:10px; margin-top:5px}
.record { margin-top:10px; padding-top:10px; border-top:1px solid #dedede; text-align:right}

th, b { color:#757575}
h4 { color:#B94A48}

a i { padding:2px}
#login {background:url(../img/bg.jpg) center top repeat}

#login form {
    background: none repeat scroll 0 0 #efefef;
    border: 1px solid #DEDEDE;
    border-radius: 5px 5px 5px 5px;
    left: -185px;
    margin: -125px auto 20px 50%;
    padding: 30px;
    position: absolute;
    top: 50%;
}
#login form .control-label { width:85px}
#login form .controls { margin-left:100px}

.card { text-align:center; border:1px solid #ddd; width:400px; background:url(../img/the_khach_hang_06.jpg); background-size:cover; height:115px; padding:130px 20px 20px; position:relative}
.card * { padding:10px 15px}
.card dl { margin-top:0px}
.card dl dt, .card dl dd{float:left; text-align:left; padding:5px}
.card dl dd { width:25%}
.card dl dt { width:60%}
.card h2{ text-transform:uppercase; font-size:24px; color:#2F96B4; margin:0}
.card h2 small { font-size:11px; text-transform:none; font-style:italic; padding:0; display:block}
.card .bg_blue { background:#2F96B4; color:#fff}
.card p { padding:0px; margin:0}
.card .name { font-size:18px}
.card span { position:absolute; width:180px; left:35px; bottom:20px; color:#fff; padding:0; font-size:11px}
.card .barcode { height:45px; width:120px; background:#fff; position:absolute; right:20px; bottom:10px; padding:0}
.card .address { margin:15px; border-top:1px solid #ddd; padding-top:15px; font-size:11px}
.card .barcode .img-barcode { height: 42px;
    position: absolute;
    right: -10px;
    top: -8px;
    width: 110px;
}

#domat { width:650px}
#domat input[type=text] { width:40px; margin:0px}
#domat .label-control { width:40px; margin:0px }

.p_r_20		{ padding-right:20px}
.p_l_10		{ padding-left:10px}
.p_b_10		{ padding-bottom:10px}

/*------------ use hide processing in login page ------------*/
.ajaxProgress
{
	border: 1px solid #cccccc;
	position: absolute;
	background-color: #f7ce00;
	right: 0px;
	color: #000;
	font-weight: inherit;
	top: 0px;
	visibility: hidden;
	padding-left: 2px;
}
/*------------ css for popup ------------*/
.ModalPopupBG {
    background-color: #666699;
    filter: alpha(opacity=50);
    opacity: 0.7;
}

.popupConfirmation {
    width: 300px;
    height: 200px;
}

.popup_Titlebar {
	background: url(Images/titlebar_bg.jpg);
	height: 29px;
	text-align: center;
}

.popup_Body {
    padding: 15px;   
    color: #000000;
    line-height: 15pt;
    clear: both;
    padding: 20px;   
}

.TitlebarLeft {
    float: left;
    padding-left: 5px;
    padding-top: 5px;
    font-weight: bold;
    font-size: 12px;
    color: #FFFFFF;
}

.TitlebarRight {
    background: url(../../Images/cross_icon_normal.png);
    background-position: right;
    background-repeat: no-repeat;
    height: 15px;
    width: 16px;
    float: right;
    cursor: pointer;
    margin-right: 5px;
    margin-top: 5px;
}

select { margin-bottom:0; height:30px}
.required { color: Red; }

.auto-style1 {
    width: 11%;
}

.auto-style2 {
    width: 185px;
}

.lblMsg
{
	/*text-align:center; 	font-family: verdana, Arial, Helvetica; 	font-size: 11px; 	font-weight: bold; 	border-color: #006B31; 	background-color: #ffffcc; 	color: #4C7A9E; 	padding: 8px; 	padding-left:8px; 	padding-top:8px; 	padding-bottom:8px; 	margin: 0px; 	border-top-width: 1px; 	border-style: solid; 	border-width: 1px; 	border-color: #888888;*/
	display: inline-table;
	display: inline-block;
	height: 14px;
	margin: 2px;
	padding: 6px;
	padding-left: 10px;
	padding-right: 10px;
	border-style: solid;
	border-width: 1px;
	border-color: #999999;
	border-top-color: #edebe3;
	border-left-color: #edebe3;
	border-bottom-color: #edebe3;
	border-right-color: #edebe3;
	background-color: #ffffcc;
	color: #4C7A9E;
	font-family: Arial, verdana, Tahoma, Helvetica;
	font-size: 12px;
	font-weight: bold;
	white-space: nowrap;
}

.text_bold
{
	font-weight:bold;
}

table.optometry {
    margin-left: 300px; /* IE */
    margin-left: 100px !important; /* Firefox */
}