@media only screen and (min-width:320px) and (max-width:560px){	
body {
width:100%;
height:100%;
overflow-x:hidden;
padding-top:0;
padding-bottom:0;
display:block;
overflow-x:hidden;
scrollbar-arrow-color:#ffffff;
scrollbar-base-color:#eaeaea;
scrollbar-dark-shadow-color:#6365ff;
scrollbar-face-color:#596F80;
scrollbar-highlight-color:#eaeaff;
scrollbar-shadow-color:#eaeaff;
-webkit-text-size-adjust:none; -ms-text-size-adjust:none;
}

body,p,li,td {
font-family:Georgia, Times New Roman, Times, serif;
//font-size:18px; 
color:#ffffff; 
text-align:justify;
//margin-right: auto;
//margin-left: auto;
margin: auto
}

.bodystyle{
width:100%;
height:100%;
background-color: #0000ff;                      
}

.table{
width: 860;
padding-right:18;
padding-left:18;
padding-top:0;
padding-bottom:0;
cellpadding:0; 
cellspacing:0; 
border:0;
overflow-x:auto;
}

.table1{
width: 930;
overflow-x:auto;
border: 0px #ffffff;  
}

.table2{
width: 100%; 
padding-right:18;
padding-left:18;
padding-top:0;
padding-bottom:0;
cellpadding:0; 
cellspacing:0; 
border:1;
overflow-x:auto;
border: 0px #ffffff;  
box-shadow: inset 5px 5px 10px white, 2px 5px 73px blue; 
-webkit-box-shadow: inset 5px 5px 10px white, 2px 5px 73px blue; 
-moz-box-shadow: inset 5px 5px 10px white, 2px 5px 73px blue;
}

#container{
width:auto;
margin: 0 0 0 0; /* top, right, bottom, left */
padding: 0px;
//white-space: nowrap; 
display: block;
text-align: left;
border: 0px solid #000;
}

#content{
width:100%;
text-align:left;
margin:0 auto;
overflow: auto;
}

img {
align:center;
max-width:100%;
height:auto;
}

//.length {
//display:inline-block;
//background-color:#0066cc;
}

//.length:hover {
//display:inline-block;
//height: 20px;  
//width: auto;
//white-space:nowrap;
//float:left; 
//background-color: #59aaff;
//text-decoration: none;
//color: #00177B;
}

.example {
padding-top:10px;
font-size: 44px; 
font-weight: 600;  //semi bold    
padding-left: 18px;  
padding-right: 18px;
color: #00487D; 
}

img {padding-left: 12px;}  

.m1 {padding-left: 14px;}

.example1 {
padding-top: 15px;
font-size: 30px;
padding-left: 10px;
padding-top:18;
font-weight:bold;
//color: #00487D;
text-align:left;}

.example2 {
font-size: 48px;
font-weight: 800;  //bold
padding-left: 10px;
//color:#5971AD;
text-align:left;}

@media screen and (min-width:1200px){
#container{width:1100px;}  
header h1#logo a{width:1100px;height:150px;background:url(../img/bg.gif) no-repeat 0 0;}               
}

<!--mobile phone display-->
@media screen and (max-width:767px){
#container{width:320px;} 
header h1#logo a{width:320px;height:44px;background:url(../img/bg.gif) no-repeat 0 0;}                
}

#tblmain {
background-color:#ffffff;
}

#tdnav {
border-left: 1px solid #000000;
border-right: 1px solid #000000;
padding-top: 0px;
background: url(./../img/pool_3a.jpg);
background-size: 100% 100%;
//background-color: #CFDCE6
}

#tdcnt {
border-right: 1px solid #000000;
padding: 6px;
width:750px;
}

#tdcnt1 {
border-right: 1px solid #000000;
padding: 6px;
width:750px;
background-color: #ffffff;
}

.cnttable{ /* this is for preview */
background-color: #ffffff;
}

.mainnav {
font-size: 13px;
width: 100%;
font-weight: bold;
letter-spacing: 1px;
padding-top: 1px;
height: 20px;
width: 330px;
border-bottom: 1px solid #333333; 
background-color: #596F80;
}

.mainnav1 {
font-size: 15px;
width: 100%;
font-weight: bold;
letter-spacing: 1px;
text-align: center;
padding-top: 0px;
height: 18px;
width: 80px; 
border-bottom: 1px solid #333333; 
background-color: #0066cc;  
}

.mainnav2 {
font-size: 13;
width: auto;
font-weight: bold;
letter-spacing: 1px;
padding-top: 3px;
height: auto;
width: 560;
//white-space: nowrap;
//overflow:auto; 
//text-flow:ellipsis;
border-bottom: 1px solid #333333; 
background-color: #0066cc;  
}

.mainnav3 {
font-size: 14;
line-height: 1.8;
font-weight: bold;
letter-spacing: 1px;
padding-top: 3px;
height: auto;
width: auto;
display: block;
white-space: nowrap;
//overflow:auto; 
//text-flow:ellipsis;
border-bottom: 1px solid #333333; 
background-color: #0066cc;  
}

.mainnav3a {
text-align: center;
font-size: 20;
line-height: 1.8;
color: #ffffff;
font-weight: bold;
letter-spacing: 1px;
padding-top: 3px;
//padding-right: 19px;
height: auto;
width: auto;
display: block;
white-space: nowrap;
//overflow:hidden; 
//text-flow:ellipsis;
border-bottom: 1px solid #333333; 
background-color: #0066cc;  
}

.navstyle {
text-decoration: none;
color: #ffffff;
}

.navstyle1 {
text-decoration: none;
color: #ffffff;
display: inline-block;
height: 15px;  
width: auto;  
}

.navstyle1:hover {
display:inline-block;
height: 20px;  
width: auto;
white-space:nowrap;
//float:left; 
//background-color: #59aaff;
text-decoration: none;
color: #59eeff;  
}

.navstyle2 {
text-decoration: none;
color: #ffffff;
display: inline-block;
height: 20px;  
width: auto;  
}

.navstyle2:hover {
display:inline-block;
height: 20px;
width: 80px; 
background-color: #59aaff;
text-decoration: none;
color: #00177B;
}

.navstyle3 {
text-decoration: none;
color: #ffffff;
display: inline-block;
height: 20px;  
width: auto;  
}

.navstyle3:hover {
display:inline-block;
height: 20px;
width: 80px; 
background-color: #59aaff;
text-decoration: none;
color: #00177B;
}


/* Headline style */
h2 {
//padding-left:9;
font-size:28px;
color:#00487D;
text-align:left;	
}

/*Heading 1 */
h4 {
padding-top:18;
font-size:16px;
font-weight:bold;
color: #00487D;
text-align:left;	
}

/*Heading 2 */
h5 {
font-size:15px;
color:#000000;
text-align:left;
font-weight:bold;
background-color: #eaeaea; 
margin-left: 0px;
padding: 2px;
}

/*Style 1 */
h6 {
font-size:11px;
font-weight: normal;
color:#000000;
text-align: justify;
margin-left : 0;
border: 1px solid #00487D;
padding: 3px;
}

#footer {
text-align: right;
font-size: 5px;
background-color: #000000;
border-bottom: 1px solid #ffffff;
padding: 2px;
}

#footerlink {
color:#ccccff;
text-decoration: none;}
}