/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-width: 320px) 
  and (max-width: 480px)
{

    body {
        overflow:auto;
    }

    .Wrapper {
        min-width:319px;
        max-width:480px;
        overflow-x:auto;
        overflow-y:auto;
    }

    .logo 
    {
        height:70px;
        max-width:98% !important;
    }

    .logoutContainer {
        position:absolute;
        top:5px;
        float: left;
        font-size: 98%;
        width:98%;
        height: 30px;
        text-align: right;
        line-height:30px;
    }

    .MainContentContainer {
        min-width: 98%;
        max-width: 98%;
        min-height:320px;
    }

    .PageHeading { 
        float:left;
        margin:0px;
        margin-top:4px;
        position:inherit;
        z-index:0;
        height:40px;
        min-width:100%;
        background:none;
        background-color:#a1c5d9;
        text-align: center;
    }

    .PageHeadingInner {
        top:0px;
        line-height: 40px;
    }

    /*Basic.css Default page*/
    .content {
        width:250px;
        margin:10px auto;
        padding:1px;
    }

    .label {    width:90px;    }

    #loginBox {
        width: 250px;
        height: 230px;
    }

    .textbox {
        height: 30px;
        width:140px;
    }

    #lb_FPass {
        display:block;
        padding:15px;
        cursor:pointer;
    }
}


/* ----------- iPhone 5 and 5S ----------- */

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait), (min-width: 320px) and (max-width: 568px) and (orientation: portrait)
 {

    body {
	background-color:#769bb6;
    overflow:auto;
	-webkit-text-size-adjust: 100%;
    }

    .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }

    .Wrapper {
        min-width:319px;
        max-width:319px;
        /* max-width:568px; for landscape */
        overflow-x:auto;
        overflow-y:auto;
    }

     /*Basic.css Default page*/
     header
     {
	display:block;
	background-color:#FFF;
	width:100%;
	height:140px;
	margin:0px;
        text-align:center;
     }

     .logo
      { 
	padding-top:5px;
     }

     #sec
     {
	background-color:#769bb6;
	display:block;
	min-width:98% !important;
	text-align:center;
     }

     #loginBox {
	display:inline-block;
        min-width:90%;
        height:340px;
	margin:0px;
    }


    .content {
        width:80%;
        margin:10px auto;
        padding:1px;
    }

    .label {    
	display:block;
	width:99%;
	text-align:left;    
	text-transform:uppercase;
     }

    .textbox {
        width:99%;
	zoom:0;
    }

    #lb_FPass {
        display:block;
        padding:15px;
        cursor:pointer;
	text-transform:uppercase;
    }

    .btn 
    {
      background-color:#4278ad;
      border:1px solid #000;
      color:#000;
      width:190px;
      line-height:35px;
      height:35px;
     font-size:120%;
     }


     #MBox 
     {
      width:90%;
      border:0px solid #769bb6;
      color:red;
  	  padding:0px;
      text-align:center;
      }

}

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: Landscape), (min-width: 320px) 

and (max-width: 568px) and (orientation: Landscape) 
{
    .Wrapper {
        min-width:560px;
        max-width:560px;
        overflow-x:auto;
        overflow-y:auto;
    }

     .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }

    .PageHeading {
    float: left;
    margin: 0px;
    margin-top: 4px;
    position: inherit;
    z-index: 0;
    height: 40px;
    min-width: 100%;
    background: none;
    background-color: #a1c5d9;
    text-align: center;
    }

     .PageHeadingInner {
        top:0px;
        line-height: 40px;
    }
}


/* ----------- iPhone 6 ----------- */

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)  and (orientation: portrait), (min-width: 375px) and (max-width: 667px)  and (orientation: portrait)  
 { 
    body {
        overflow:auto;
    }

    .Wrapper {
        min-width:370px;
        max-width:370px;
         overflow-x:auto;
        overflow-y:auto;
    }

     .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }

}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 668px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape),(min-width: 375px) and (max-width: 668px)  and (orientation: landscape)   { 
     body {
        overflow:auto;
    }

    .Wrapper {
        min-width:660px;
        max-width:660px;
         overflow-x:auto;
        overflow-y:auto;
    }

     .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }

    .PageHeading {
    float: left;
    margin: 0px;
    margin-top: 4px;
    position: inherit;
    z-index: 0;
    height: 40px;
    min-width: 100%;
    background: none;
    background-color: #a1c5d9;
    text-align: center;
    }

     .PageHeadingInner {
        top:0px;
        line-height: 40px;
    }
}

/* ----------- iPhone 6+ ----------- */

/* Portrait  */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 737px) 
  and (-webkit-min-device-pixel-ratio: 3)  and (orientation: portrait), (min-width: 414px) and (max-width: 737px) and (orientation: portrait) { 
       body {
        overflow:auto;
    }

    .Wrapper {
        min-width:410px;
        max-width:410px;
        overflow-x:auto;
        overflow-y:auto;
    }

     .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }
}


/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape),(min-width: 414px) and (max-width: 736px) and (orientation: landscape) { 
    body {
        overflow:auto;
    }

    .Wrapper {
        min-width:730px;
        max-width:730px;
        overflow-x:auto;
        overflow-y:auto;
    }
     .PageHeading {
    float: left;
    margin: 0px;
    margin-top: 4px;
    position: inherit;
    z-index: 0;
    height: 40px;
    min-width: 100%;
    background: none;
    background-color: #a1c5d9;
    text-align: center;
    }

     .PageHeadingInner {
        top:0px;
        line-height: 40px;
    }

   .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }
}


/* ----------- iPad mini, iPad 1 and 2, iPad 3 and 4 ----------- */

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1), (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) 
{
    body {
        overflow:auto;
    }

    .Wrapper {
        min-width:768px;
        max-width:768px;
        overflow-x:auto;
        overflow-y:auto;
    }
     .PageHeading {
    float: left;
    margin: 0px;
    margin-top: 4px;
    position: inherit;
    z-index: 0;
    height: 40px;
    min-width: 100%;
    background: none;
    background-color: #a1c5d9;
    text-align: center;
    }

     .PageHeadingInner {
        top:0px;
        line-height: 40px;
    }

     .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }
}





/*@media only screen and (min-width:319px) and (max-width:740px) and (orientation: portrait) {

    .Wrapper {
        min-width:97%;
        max-width:97%;
        display:table;
        padding:0;
        margin:10px auto;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        background-color: #fff;
        overflow:scroll;
    }

    .MainContentContainer {
        min-width: 98%;
        max-width:740px;
        min-height:500px;
        overflow:scroll;
    }

    .PageHeading {
        float:left;
        width: 100%; 
        background:#6a8fa7;
        position:inherit;
        top:0px;
        height:40px;
        z-index:0;
        max-width:100%; 
        margin-left:0px;
    }

    #lblTitle {
        line-height:40px;
        color:white;
        position:inherit;
    }

    .menu {
        background-color:#4c4c4c;
        padding:0px;
        height:0px;
    }

     .MenuContainer {
       display:block;
    }
     .MainContentContainer {
        min-width:98%;
        max-width:720px; 
        min-height:500px;
    }

     .BottomContainer {
        display:block;
        word-wrap:hyphenate;
        width:60%;
        margin-left:14%;
        margin-right:10%;
        margin-bottom:0px;
    }

     .logoutContainer {
        bottom:0px;
        width:auto;
    }

    .FontClass {
        font-size: 80%;
        padding: 0px;
    }

    .row {
        min-width:100%;
        padding:0px;
    }

    .Lcolumn {
        min-width:98% !important;
        max-width:98%;
        text-align:left;
        background-color:#eee;
    }

    .Rcolumn {
       min-width:98%;
       max-width:98%;
    }

    .magFilter 
    {
        border-radius: 2px;
        margin:0px;
        padding:0px;
        text-align:left;
    }

    .pure-form legend {
        background-color:#e2e2e2;
        width: 99%;
        color: #333;
        text-transform:uppercase;
        font-weight:bold;
    }

    .pure-form fieldset {
        max-width:97% !important;
    }
}*/