.grid {
    border-collapse: collapse;
    width: 100%;
}

.grid-header {
    border-left: 2px solid #D6E8FF;
    border-right: 2px solid #D6E8FF;
    border-top: 2px solid #D6E8FF;
    border-bottom: #8c8c8c 2px solid;
    padding: 6px 5px;
    text-align: left;
    border-top-style:hidden;
}

.grid-footer {
    padding: 6px 5px;
    text-align: left;
}

.grid-row {
    border-bottom: 1px solid #d2d2d2;
    border-left: 2px solid #D6E8FF;
    border-right: 2px solid #D6E8FF;
    min-height: 15px;
}

.grid-alternating-row {
    background-color: #e6f1f7;
    border-bottom: 1px solid #d2d2d2;
    border-left: 2px solid #D6E8FF;
    border-right: 2px solid #D6E8FF;
    min-height: 15px;
}

td a { position: relative; }

td a:link, td a:visited, td a:active, td a:hover { padding: 0; }

th a {
    display: block;
    position: relative;
}

th a:link, th a:visited, th a:active, th a:hover {
    font-weight: bold;
    padding: 0;
    text-align: left;
}

th a:hover { color: #000; }

th.asc a:after, th.desc a:after {
    display: block;
    font-size: 0.75em;
    position: absolute;
    right: 0em;
    top: 0;
}

th.asc a:after { content: '▲'; }

th.desc a:after { content: '▼'; }

.warrant-nbr-column { width: 9% ; }

.title-column { width: 21%; }

.narrow-column
{
    width: 10%;
}

.dob-column
{
    width: 12%;
}

.desc-column
{
    width: 70%;
}

.code-column
{
    width: 20%;
}

.cell
{
    float: left;
    width: 30%;
}

.detail-cell
{
    float: left;
    width: 50%;
}

.detail-label 
{ 
    width: 100px; 
    /*padding-left: 5px;*/
}

.add-bold
{ 
    font-weight: bold;
}

table.layout { width: 100%; }
table.layout td, table.layout th { border: medium none; }

.like-caption
{
    font-size: 1.17em;
    font-weight: bold;
    text-align: center;
    background-color: #eeeeee;
    margin: 5px 0 10px;
    padding: 2px 0;
}

.warrant-table
{
    width: 100%;
    vertical-align: top;
    border-collapse: separate !important;
}

.app-top-menu
{
   min-height: 30px;
   font-size: 1.1em;
   border-style: none;
   border-bottom-style: solid;
   border-bottom-width: 1px;
   margin-bottom: 20px;
   padding-left: 10px;  
   padding-top: 5px;
   vertical-align:top;
}

.app-top-menu span
{
   /*padding-left: 50px;*/
}

.app-link
{
   text-decoration: none;
   white-space: nowrap;
   margin-right: 50px;
}

.app-link:hover
{
   text-decoration: underline;
}
.app-bottom-menu
{
   margin-top:20px;
   white-space: nowrap;
   text-align: center;
   font-weight: bold;
}
.align-center
{
    text-align: center;
}
.align-right
{
    text-align: right !important;
}

/*#serach-criteria 
{
    padding: 10px;
    line-height: 1.65;
    margin: 10px 0px 20px;
    background-color: #E6F1F7;
    border: 1px solid lightgray;
    overflow:auto;
}*/

.search-name
{
    float: left;
    width: 30%;
}

.search-dob
{
    float: left;
    width: 25%;
}

.search-button
{
    float:left;
    width:10%;
}


.div-left-half
{
    width: 52%; 
    float: left; 
    display: inline-block;
}
.div-right-half
{
    width: 47%; 
    float: right; 
    display: inline-block;
}

.display-red
{
    color:#CC0000;
}

.searcherr {
    margin: 7rem 1rem 1rem 2rem;
}

/****************************************************/
/*     Style sheet for Mobile Display               */
/****************************************************/
@media (max-width: 1210px) {
    .searcherr {
        margin: 8rem 1rem 1rem 2rem;
        /*background-color: blue;*/
    }
}




@media (max-width: 900px) {

   body 
   {
        overflow-x: scroll;
   }
   .search-name {
        float: none;
        width: inherit;
        margin-top: 10px;
    }
    .search-dob {
       float: none;
       width: inherit;
       margin-top: 10px;
       padding-left: 12px; /* This lines up the text and the end of the textboxes */
    }
    .search-button {
       float: none;
       width: inherit;
       margin-top: 10px;
    }

    .div-left-half
    {
        width: inherit; 
        float: none; 
        display: inline-block;
    }
    .div-right-half
    {
        width: 100%; 
        float: none; 
        display: inline-block;
    }
    .searcherr {
        margin: 2.5rem 1rem 1rem 2rem;
        /*background-color: green;*/
    }
}

@media (max-width: 700px) {
    .searcherr {
        margin: 2rem 1rem 1rem 2rem;
        /*background-color: orange;*/
    }
}

@media (max-width: 500px) {
    .searcherr {
        margin: 1.5rem 1rem 1rem 2rem;
        /*background-color: purple;*/
    }
}