/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 900px;
    height:26px;
}

/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}

/*Gridview CSS to make it always in center, we call it like CssClass="grid"*/
.grid td, .grid th{
  text-align:center;
}
/*End gridview CSS*/

/*Backgrounds*/
.BG_Blue {
     text-align:center;
     vertical-align:middle;
     height:25px;
     background-image: url("bg/Background_blue_2.png");
     background-repeat: repeat-x;
}

.BG_Blue_dark {
     text-align:center;
     vertical-align:middle;
     height:30px;
     background-image: url("bg/Background_blue_dark.png");
     background-repeat: repeat-x;
}

.BG_Blue_dark {
     text-align:center;
     vertical-align:middle;
     height:30px;
     background-image: url("bg/Background_blue_dark.png");
     background-repeat: repeat-x;
}

.BG_Black {
     text-align:center;
     vertical-align:middle;
     height:30px;
     background-image: url("bg/Background_black.png");
     background-repeat: repeat-x;
}

.BG_Gray {
     text-align:center;
     vertical-align:middle;
     height:30px;
     background-image: url("bg/Background_gray.png");
     background-repeat: repeat-x;
}
/*End backgrounds*/

/*td syles*/
.td_message{
    text-align:center;
    width: 800px;
    direction:rtl;
}

.td_message_r{
    text-align:right;
    width: 800px;
    direction:rtl;
}

.td_r{
    text-align:right;
}

.td_l{
    text-align:left;
}

.td_c{
    text-align:center;
}

.td_c_rtl{
    text-align:center;
    direction:rtl;
}

.td_c_full{
    width:100%;
    text-align:center;
}

.td_350{
    width: 360px;
    text-align: center;
}

.td_800{
    width: 800px;
}




.td_15r{
    width: 15px;
    text-align:right;
}

.td_15l{
    width: 15px;
    text-align:left;
}

.td_15c{
    width: 15px;
    text-align:center;
}




.td_25r{
    width: 25px;
    text-align:right;
}

.td_25l{
    width: 25px;
    text-align:left;
}

.td_25c{
    width: 25px;
    text-align:center;
}

.td_50r{
    width: 50px;
    text-align:right;
}

.td_50l{
    width: 50px;
    text-align:left;
}

.td_50c{
    width: 50px;
    text-align:center;
}

.td_75r{
    width: 75px;
    text-align:right;
}

.td_75l{
    width: 75px;
    text-align:left;
}

.td_75c{
    width: 75px;
    text-align:center;
}

.td_85r{
    width: 85px;
    text-align:right;
}

.td_85l{
    width: 85px;
    text-align:left;
}

.td_85c{
    width: 85px;
    text-align:center;
}

.td_100r{
    width: 105px;
    text-align:right;
}

.td_100l{
    width: 105px;
    text-align:left;
}

.td_100c{
    width: 105px;
    text-align:center;
}

.td_125r{
    width: 125px;
    text-align:right;
}

.td_125l{
    width: 125px;
    text-align:left;
}

.td_125c{
    width: 125px;
    text-align:center;
}

.td_150r{
    width: 150px;
    text-align:right;
}

.td_150l{
    width: 150px;
    text-align:left;
}

.td_150c{
    width: 150px;
    text-align:center;
}

.td_165r{
    width: 165px;
    text-align:right;
}

.td_165l{
    width: 165px;
    text-align:left;
}

.td_165c{
    width: 165px;
    text-align:center;
}

.td_175r{
    width: 175px;
    text-align:right;
}

.td_175l{
    width: 175px;
    text-align:left;
}

.td_175c{
    width: 175px;
    text-align:center;
}

.td_200r{
    width: 200px;
    text-align:right;
}

.td_200l{
    width: 200px;
    text-align:left;
}

.td_200c{
    width: 200px;
    text-align:center;
}

.td_225r{
    width: 225px;
    text-align:right;
}

.td_225l{
    width: 225px;
    text-align:left;
}

.td_225c {
    width: 225px;
    text-align: center;
}

.td_250r{
    width: 250px;
    text-align: right;
}

.td_250l{
    width: 250px;
    text-align:left;
}

.td_250c{
    width: 250px;
    text-align:center;
}

.td_275r{
    width: 275px;
    text-align:right;
}

.td_275l{
    width: 275px;
    text-align:left;
}

.td_275c{
    width: 275px;
    text-align:center;
}

.td_300r{
    width: 300px;
    text-align:right;
}

.td_300l{
    width: 300px;
    text-align:left;
}

.td_300c{
    width: 300px;
    text-align:center;
}

.td_350r{
    width: 350px;
    text-align:right;
}

.td_350l{
    width: 350px;
    text-align:left;
}

.td_350c{
    width: 350px;
    text-align:center;
}

.td_375r{
    width: 375px;
    text-align:right;
}

.td_375l{
    width: 375px;
    text-align:left;
}

.td_375c{
    width: 375px;
    text-align:center;
}

.td_400r{
    width: 400px;
    text-align:right;
}

.td_400l{
    width: 400px;
    text-align:left;
}

.td_400c{
    width: 400px;
    text-align:center;
}

.td_500c{
    width: 500px;
    text-align:center;
}
/*End td styles*/

/*Table Css*/
.mTable {
    width:100%;
    table-layout: auto;
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-top: 1px solid #ddd; 
    border-bottom: 1px solid #ddd;
}
/*End table CSS*/


/*My customize CSS from the old app*/
/*Auto complete items style*/
.autoCompList
{
	width: auto;
	height: 300px;
	position: relative;
	margin-left: 0px;
	padding-left: 0px;
	overflow: auto;
}

.completionList {
margin:0px;
padding:1px;
height: 25px;
overflow:auto;
background-color: #FFFFFF;
border-top: 1px solid #CC3300;
font-size:15px;
color:Black;
}

.itemHighlighted 
{
margin:0px;
padding:1px;
height: 25px;
overflow:auto;
background-color: #ADD6FF;   
border-top: 1px solid #CC3300;    
font-size:15px;
}
/*End auto complete style*/

/*Pop up progress loading style*/
/* The Modal (background) */
.m_modal {
    /*display: initial;*/ /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 9000; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.m_modal-content {
    background-color: #fefefe;
    margin: 15% auto; /* 15% from the top and centered */
    padding: 0px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/*Button style*/
.myButton {
	-moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	-webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
	box-shadow:inset 0px 1px 0px 0px #54a3f7;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
	background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
	background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
	background-color:#007dc1;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	border:1px solid #124d77;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:13px;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #154682;
}
.myButton:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
	background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
	background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
	background-color:#0061a7;
}
.myButton:active {
	position:relative;
	top:1px;
}





/*Button style red*/
        .button-success,
        .button-error,
        .button-warning,
        .button-secondary {
            color: white;
            border-radius: 4px;
            text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
        }

        .button-success {
            background: rgb(28, 184, 65); /* this is a green */
        }

        .button-error {
            background: rgb(202, 60, 60); /* this is a maroon */
        }

        .button-warning {
            background: rgb(223, 117, 20); /* this is an orange */
        }

        .button-secondary {
            background: rgb(66, 184, 221); /* this is a light blue */
        }



.modalBackground
        {
            background-color: Black;
            filter: alpha(opacity=60);
            opacity: 0.6;
        }
        .modalPopup
        {
            background-color: #FFFFFF;
            width: 300px;
            border: 3px solid #0DA9D0;
            border-radius: 12px;
            padding: 0;
        }
        .modalPopup .header
        {
            background-color: #2FBDF1;
            height: 30px;
            color: White;
            line-height: 30px;
            text-align: center;
            font-weight: bold;
            border-top-left-radius: 6px;
            border-top-right-radius: 6px;
        }
        .modalPopup .body
        {
            min-height: 50px;
            line-height: 30px;
            text-align: center;
            font-weight: bold;
        }
        .modalPopup .footer
        {
            padding: 6px;
        }
        .modalPopup .yes, .modalPopup .no
        {
            height: 23px;
            color: White;
            line-height: 23px;
            text-align: center;
            font-weight: bold;
            cursor: pointer;
            border-radius: 4px;
        }
        .modalPopup .yes
        {
            background-color: #2FBDF1;
            border: 1px solid #0DA9D0;
        }
        .modalPopup .no
        {
            background-color: #9F9F9F;
            border: 1px solid #5C5C5C;
        }