@media only screen and (max-width: 1024px) 
{
    .headDiv
    {
        width:100%;
    }
    .headDiv2
    {
        width:100%;
    }
    
    .BannerImg
    {
        width : 97%;
        margin-bottom: 1%;
    }
    .MainImage
    {
        width:100%;
        height : 300px;  
    }    
    
    .login
    {
        margin-top : 1%;
        width : 65%;
        margin-right: 30%;
        border: 2px solid #00C13F;
        -moz-border-radius: 6px 6px 6px 6px;
        -webkit-border-radius: 6px;
         padding:5px;        
        
    }
    .loginDisplay {
        font-size: 1px;
        text-align: right;
        color: White;
        float : right;
    }
    .modalPopup
    {
        width: 90%;
        height: 40%; 

    
    }    
    
}



@media screen and (max-width:700px)
{
    
    .BannerImg
    {
        width : 95%;
        margin-bottom: 1%;
        min-height: 380px;        
    }
    .MainImage
    {
        width:100%;
        min-height: 378px;
    }    
    .login
    {
        width : 75%;
        border: 2px solid #00C13F;
        -moz-border-radius: 6px 6px 6px 6px;
        -webkit-border-radius: 6px;
         padding:5px; 
         float:right; 
         position: absolute;
         margin-left: 10%;
         margin-top :1%;
    }
    
    .workOrderLeftDiv
    {
        width : 100%;
        float : left;
    }
    .workOrderRightDiv
    {
        width : 100%;
        float : left;
        margin-bottom : 0;
        min-height : 0;
    }
    .WorkOrderDiv
    {
        width : 100%;
    }
    .AgeDiv
    {
        width : 86%;
        float : left;
    }
    .DateDiv
    {
        float:left; 
        width: 66%;  
        margin-bottom : 2px;
    }
    
    .TimeDiv
    {
        width : 63.2%;
        float : left;
    }
    .Doctor
    {
        width :  90%;
        float : left;  
    }
    .RefrDoctor
    {
        width :  100%;
        float : left;  
    }
    
    .mydatagrid
    {
        width : 100%;
    }
    .ImgEdit
    {
        min-width : 20px;
    }

    .ImgDelete
    {
        min-width : 20px;
    }

    .PrintTable
    {
        display : none;
    }
    .PrintMobile
    {
        display : block;
        width : 100%;
    }
    
    .MainDivMobile
    {
        margin-top: 1px;
        width : 100%;
        border-color:#C8C6B1;
        border-width:1px;
        border-style:Solid;
        text-align:center;    
        float : left;    
        font-family :  "Times New Roman", Times, serif	;
        color : #4E4E4E;
    }
    
    .BookingNo
    {
        text-align : center;
        background-color : #4b6c9e;
        font-size : 15px;
        font-family :Tahoma, Geneva, sans-serif;
        color : White;
    }
    .PatientId
    {
        text-align : center;
        font-size : 15px;
    }
    .SampleId
    {
        text-align : center;
        font-size : 15px;
    }
    .Test
    {
        text-align : center;
        font-size : 15px;
        color : #333333;
    }
    .MainLink
    {
        width : 100%;
        text-align : center;
        font-size : 15px;
    } 
    .Download
    {
        width: 35%;
        text-align : center;
        font-size : 15px;
        float : left;
        text-decoration: none;
        
    } 
    .View
    {
        float : right;
        width: 30%;
        text-align : center;
        font-size : 15px;
    } 
    .Print
    {
        float : right;
        width: 30%;
        text-align : center;
        font-size : 15px;
    } 
    .Space
    {
        min-height : 100px;
    } 
    .LeftDiv
    {
        float:left;
    }
    .RightDiv
    {
        float:left;
    }
    
    .WorkOrderTestHead
    {
        width : 100%; 
    }
    .WorkOrderTestDtls
    {
        width : 100%; 
    }
    
.logo{position:absolute;top:0;left: 0;width:100%;height:46px;text-align:center;padding:10px 0 0 0 ;float:none}
.logo2{display:none}
nav{width:100%;}
#cssmenu{width:100%}
#cssmenu ul{width:100%;display:none;margin-left: -20px;}
#cssmenu ul li{width:100%;border-top:1px solid #444}
#cssmenu ul li:hover{background:#363636;}
#cssmenu ul ul li,#cssmenu li:hover > ul > li{height:auto}
#cssmenu ul li a,#cssmenu ul ul li a{width:100%;border-bottom:0}
#cssmenu > ul > li{float:none}
#cssmenu ul ul li a{padding-left:25px}
#cssmenu ul ul li{background:#333!important;}
#cssmenu ul ul li:hover{background:#363636!important}
#cssmenu ul ul ul li a{padding-left:35px}
#cssmenu ul ul li a{color:#ddd;background:none}
#cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a{color:#fff}
#cssmenu ul ul,#cssmenu ul ul ul{position:relative;left:0;width:100%;margin:0;text-align:left}
#cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before{display:none}
#cssmenu #head-mobile{
    display: block;
    padding: 17px;
    color: #ddd;
    font-size: 12px;
    font-weight: 700;
}
.menu_link{width:55px;height:46px;position:absolute;right:0;top:0;cursor:pointer;z-index: 12399994;}
.menu_link:after{position:absolute;top:22px;right:20px;display:block;height:4px;width:20px;border-top:2px solid #dddddd;border-bottom:2px solid #dddddd;content:''}
.menu_link:before{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;position:absolute;top:16px;right:20px;display:block;height:2px;width:20px;background:#ddd;content:''}
#cssmenu .submenu-button{position:absolute;z-index:99;right:0;top:0;display:block;border-left:1px solid #444;height:46px;width:46px;cursor:pointer}
#cssmenu .submenu-button.submenu-opened{background:#262626}
#cssmenu ul ul .submenu-button{height:34px;width:34px}
#cssmenu .submenu-button:after{position:absolute;top:22px;right:19px;width:8px;height:2px;display:block;background:#ddd;content:''}
#cssmenu ul ul .submenu-button:after{top:15px;right:13px}
#cssmenu .submenu-button.submenu-opened:after{background:#fff}
#cssmenu .submenu-button:before{position:absolute;top:19px;right:22px;display:block;width:2px;height:8px;background:#ddd;content:''}
#cssmenu ul ul .submenu-button:before{top:12px;right:16px}
#cssmenu .submenu-button.submenu-opened:before{display:none}
#cssmenu ul ul ul li.active a{border-left:none}
#cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a{border-top:none}

    .modalPopup
    {
        width: 90%;
        height: 60%; 

    
    }
    
    .HomeMainDivLeft
    {
        float: left;
        width: 100%;
    }

    .HomeMainDivRight
    {
        float: left;
        width: 100%;
    }   
    
       
    .DispatchDiv
    {
        width:80%;
    }    
     


}


@media only screen and (max-width: 510px) 
{
    
     
    .login
    {
         margin-top :2%;
    }
    .title
    {
        display: block;
        float: left;
        text-align: left;
        width: 50%;

    }
    
    .header h1
    {
        font-weight: 700;
        margin: 0px;
        padding: 0px 0px 0px 20px;
        color: #f9f9f9;
        border: none;
        font-size: 1.4em;
    }
    .branch
    {
        display: block;
        text-align: center;
        width: auto;
        padding-right: 10%;
        font-size: 1px;
        float : right;
    }
    .address
    {
        display: block;
        text-align: center;
        width: auto;
        padding-right: 10%;
        font-size: 1px;
        float : right;
        margin-bottom:10px;
    
    }

    .loginDisplay {
        font-size: 1px;
        text-align: right;
        color: White;
        float : right;
    }

    .DateDiv
    {
        float:left; 
        width: 78%;  
    }
    
    .TimeDiv
    {
        width : 83%;
        float : left;
    }
    .EditGridDiv
    {
        border-color:#C8C6B1;
        border-width:1px;
        border-style:Solid;
        width:100%;
        text-align:center;
    }
    .ImgEdit
    {
        width : 100%;
    }

    .ImgDelete
    {
        width : 100%;
    }
    
    .modalPopup
    {
        width: 90%;
        height: 60%; 

    
    }  
    
    .DispatchDiv
    {
        width:100%;
    }    
       
}

@media screen and (max-width:320px)
{
  .MainContain
{
    width:290px;
    padding:1px;
}  
    .DivContain
{
    width:100%; 
    float: left;
}
    .DivContain2
{
    width:100%; 
    float: left;
}
.DivContainRight
{
    width:100%; 
    float: left;
}
.DivMiddle
{
    width:100%; 
    float: left;
}
.DivMiddle1
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddle2
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddle3
{
    width:100%; 
    float: left;
    min-height: auto;
}

.DivMiddleA
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddleB
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivClear
{
    height:100%;
}

}
@media screen and (max-width:480px)
{
  .MainContain
{
    width:300px;
    padding:5px;
}  
    .DivContain
{
    width:100%; 
    float: left;
}

    .DivContain2
{
    width:100%; 
    float: left;
}
.DivContainRight
{
    width:100%; 
    float: left;
}
.DivMiddle
{
    width:100%; 
    float: left;
}
.DivMiddle1
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddle2
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddle3
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddleA
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddleB
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivClear
{
    height:100%;
}

}
@media screen and (max-width:640px)
{
    
  .MainContain
{
    width:100%;
    padding:5px;
}  
    .DivContain
{
    width:100%; 
    float: left;
}

    .DivContain2
{
    width:100%; 
    float: left;
}
.DivContainRight
{
    width:100%; 
    float: left;
}
.DivMiddle
{
    width:100%; 
    float: left;
}
.DivMiddle1
{
    width:88%; 
    float: left;
    min-height: auto;
}
.DivMiddle2
{
    width:88%; 
    float: left;
    min-height: auto;
}
.DivMiddle3
{
    width:88%; 
    float: left;
    min-height: auto;
}
.DivMiddleA
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivMiddleB
{
    width:100%; 
    float: left;
    min-height: auto;
}
.DivClear
{
    height:100%;
}
}