body {
font-family : Arial;
}
div {
font-family : Arial;
}
table tr td {
vertical-align : top;
}
.thecontent {
    padding:10px; 
    margin-top:71px;  
    left: 8px; 
    right: 16px; 
    width: 98.5%;
}
.ModalPanel {
left : 50%;
margin-left:-310px;
position:fixed;
top : 200px;
/*margin-top:-170px;*/
padding:15px;
border-color:white;
width :620px;
z-index : 1000;
background-image : url('../../Images/Modal.gif');
}
.MainPanel {
border : white solid 3px;
width:600px;
z-index : 2000;
padding:15px;
}
.modalbg
{
    height: 100%;
    width: 100%;
    position: fixed;
    top:0px;
    left:0px;
    background: #000;
    -moz-opacity:.50;
    filter:alpha(opacity=50);
    opacity:.50;
    display: none;
    z-index:999;
}
.modalpopbg {
    height: 100%;
    width: 100%;
    position: fixed;
    top:0px;
    left:0px;
    background: #000;
    -moz-opacity:.50;
    filter:alpha(opacity=50);
    opacity:.50;
    z-index:100;
}
.cancelpanel {
   width:535px;
   position:fixed;
   top:20px;
   left:50%;
   margin-left:-325px;
   text-align:center;
   border-radius: 5px;
   -moz-box-shadow:7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    -webkit-box-shadow:7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    box-shadow:7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    background-color: #e9e7e2; 
   z-index:2000;
}
.subContainer {
border: 1px #D99E00 solid;
margin : 5px 5px 5px 5px;
padding:3px;
-webkit-border-radius: 5px 5px 5px 5px;
-moz-border-radius: 5px 5px 5px 5px;
border-radius: 5px 5px 5px 5px;
overflow-y:auto;
}
.HeaderPanel {
text-align : center;
vertical-align : middle;
padding : 3px;
margin-bottom : 15px;
}
table.FormTable td {
padding : 10px 3px 0 3px;
}
.loginPanel {
text-align : center;
vertical-align : middle;
padding : 3px;
width : 250px;
border : black solid 1px;
}
.TogglePanel {
border : black solid 1px;
}
.FooterPanel {
border : black solid 1px;
background-color : #e1edde;
text-align : center;
vertical-align : middle;
padding-top : 5px;
}
.modalBackground {
background-color : gray;
opacity : 0.70;
}
.gridView {
font-size : 10pt;
}
.gridView td {
padding-top : 4px;
padding-bottom : 4px;
text-align : center;
vertical-align : middle;
}
.gridViewRow td {
padding-top : 4px;
padding-bottom : 4px;
text-align : center;
vertical-align : middle;
border : white solid 1px;
}
.gridViewRow th {
padding-top : 4px;
padding-bottom : 4px;
text-align : center;
vertical-align : middle;
border : white solid 1px;
}
.btnSession 
{
    width:140px
}
.btnPack {
    width:100px;
}
.btnbuysessorpack {
    width: 300px;
}
.DelModalpanel {
    width: 300px;
    position: fixed;
    top: 80px;
    left: 50%;
    margin-left: -250px;
    text-align: center;
    z-index: 2000;
    border-radius: 5px;
    -moz-box-shadow: 7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    -webkit-box-shadow: 7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    box-shadow: 7px 7px 7px 0px rgba(50, 50, 50, 0.9);
    background-color: #e9e7e2;
}
.DelModal
{
    top:80px;
   left:50%;
   margin-left:-250px;
    box-shadow: 0 0 10px 2px #a1a1a1;
    border-radius: 5px;
    margin: 0 auto;
    position: absolute;
    background: #c1c1c1;
    padding: 10px;
    z-index:1000;
    display: none;
}
.DelModalbg
{
    height: 100%;
    width: 100%;
    position: absolute;
    top:0px;
    left:0px;
    background: #000;
    -moz-opacity:.50;
    filter:alpha(opacity=50);
    opacity:.50;
    display: none;
    z-index:999;
}
.LoginText {
    width:280px;
}
.LoginAccount {
    width:150px;
    white-space:nowrap;
    height:28px;
}
.LoginCol1 {
    vertical-align:middle;
    width:20%;
}
.LoginCol2 {
    vertical-align:middle;
    width:60%;
}
.LoginCol3 {
    vertical-align:middle;
    width:20%;
}
.hoverSess {
    display: none;
    position: absolute;
    width:400px;
    padding: 5px;
    background: #eeeeee;
    color: #000000;
    border: 1px solid #1a1a1a; 
    font-size: 90%;
}
.hoverStaff {
    display: none;
    position: absolute;
    width:400px;
    padding: 5px;
    background: #eeeeee;
    color: #000000;
    border: 1px solid #1a1a1a; 
    font-size: 90%;
}
.hoverPack {
    display: none;
    position: absolute;
    width:400px;
    margin-left:100px;
    padding: 5px;
    background: #eeeeee;
    color: #000000;
    border: 1px solid #1a1a1a; 
    font-size: 90%;
}
.profile {
    top:50px;
    text-align:center;
    width:400px;
    left : 50%;
    margin-left:-200px;
    position:fixed;
    overflow:auto;
    z-index : 1000;
}
.profileTable td
{
    padding: 4px;
    border: 1px solid white;
    white-space:nowrap;
}
.ajax__calendar td
{
    padding: 0px;
    border: 0px solid white;
}
#pnlProfile {
    left : 50%;
    margin-left:-200px;
    position:fixed;
    overflow:scroll;
    width :400px;
    z-index : 1000;
}
.closebtn {
    position:absolute; 
    top:20px; 
    right:5px;
}
@media only screen and (max-width: 650px){
.profile {
text-align:center;
width:98%;
left : 2px;
margin-left:2px;
top:33px;
overflow-y:scroll;
}
.btnSession {
        width: 95%;
        white-space: normal;
        padding:2px;
}
.btnPack {
        width: 95%;
        white-space: normal;
        padding:2px;
}
.btnbuysessorpack {
        width: 95%;
        white-space: normal;
        padding:2px;
}
.gridViewRow th {
    font-size:10px;
    font-weight:700;
}
.MainPanel2{
    width:95%;
    margin-left:2px;
    top:60px;
    left:2px;
}
.MainPanel {
    width:95%;
    margin-left:2px;
    left:2px;
    padding:2px;
}
.cancelpanel {
    width:95%;
    left:2px;
    margin-left:2px;
}
.ModalPanel {
    width:95%;
    margin-left:2px;
    left:2px;
    padding:2px;
    top : 40px;
}
.LoginText {
    width:95%;
}
.LoginAccount {
width:100%;
white-space:normal;
height:35px;
font-size:10px;
padding:0px;
}
.LoginCol3 {
    font-size:10px;
}
.hoverSess {
    width:80%;
    margin-left:50px;
}
.hoverStaff {
    width:80%;
    margin-left:50px;
}
.hoverPack {
    width:80%;
    margin-left:120px;
}
.thecontent {
    padding-left:2px;
}
.heading {
        font-size:12px;
    }
}
@media only screen and (min-height: 1150px) {
    /*this is for iPads*/
.thecontent {
    height:800px;
    overflow-y:scroll;
    border-style:solid;
    border-width:0px 0px 3px 0px;
    border-color:slategrey;
}
}
@media only screen and (max-height: 730px) {
    .profile {
        height: 480px;
        overflow: scroll;
    }
}
@media only screen and (max-height: 650px) {
      .ModalPanel {
        overflow:scroll;
        height:400px;
    }
  .closebtn {
    top:10px; 
}
}