@media screen  and (min-width: 300px) and (max-width: 600px) and (orientation:portrait)
{

body
{
background:#5A84AC;
}

div.main 
{
width:99%;
margin-left:auto;
margin-right:auto;
/*padding-left:10px;
padding-right:10px;*/
border-style:solid;
border-color:#800080;
border-width:2px;
background:#ffffff;
/*overflow:scroll*/
}
div.header 
{
width:100%;
margin-left:auto;
margin-right:auto;
font-family:georgia;
font-size:14px;
color:#ffffff;
background:#8db1f2;
/*text-align:right*/
}

div.content
 {
 margin-left:auto;
 margin-right:auto;
 width:90%;
 padding:4%;
 border-style:solid;
 border-width:2px;
 border-color:#006fa0;
 background:#cfcfcf;
 font-family:georgia,serif;
 font-size:16px
 }
 
div.controls
{
margin-left:auto;
margin-right:auto;
background:#cfcfcf;
padding-top:3px;
padding-bottom:3px;
width:100%;
border-style:solid;
border-width:2px;
border-color:#006fa0
}

div.menu 
{
margin-left:auto;
margin-right:auto;
background:#5A84AC;
border:none;
width:90%;
font-family:arial;
font-size:12px;
color:#cfcfcf;
text-align:left
}

div.indent5
{
padding-left:5%;
}

div.impt
{
width:80%;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-width:2px;
border-color:#006fa0;
padding:5px;
}

div.firstdraft
{
color:#ff0000;
}

table.two
{
margin-left:auto;
margin-right:auto;
width:320px;
}

table.controls
{
margin-left:auto;
margin-right:auto;
width:90%;
}

tr.dk
{
background:yellow;
}

tr.lt
{
background:#ffffff;
}

span.type1 
{
font-family:arial;
font-size:14px;
color:#0000ff
}

p.indent
{
padding-left:5%;
}

p.note
{
padding-left:5%;
color: #0030ff
}

button.controls
{
position:relative;
left:3px;
width:90px;
height:50px;
background:#5077be;
font-family:georgia;
font-size:12px;
color:#ffffff
}

a.g
{
/*color:#ff8500;*/
color:#ff6347;
/*color:#ffffff;*/
}

.li 
{
padding-left:5%;
}

li.indent5
{
padding-left:5%;
}

}

@media screen  and (min-width: 600px) and (max-width: 1024px) and (orientation:landscape)
{

body
{
background:#5A84AC;
}

div.main 
{
width:99%;
margin-left:auto;
margin-right:auto;
/*padding-left:10px;
padding-right:10px;*/
border-style:solid;
border-color:#800080;
border-width:2px;
background:#ffffff;
/*overflow:scroll*/
}

div.header 
{
width:100%;
margin-left:auto;
margin-right:auto;
font-family:georgia;
font-size:18px;
height:30px;
color:#ffffff;
background:#8db1f2;
}

div.content
 {
 margin-left:auto;
 margin-right:auto;
 width:90%;
 /*height:750px;*/
 padding:4%;
 border-style:solid;
 border-width:2px;
 border-color:#006fa0;
 background:#cfcfcf;
 font-family:georgia,serif;
 font-size:16px
 }
div.controls
{
margin-left:auto;
margin-right:auto;
background:#cfcfcf;
width:90%;
padding-left:42px;
padding-top:3px;
padding-bottom:3px;
border-style:solid;
border-width:2px;
border-color:#006fa0
}

div.impt
{
width:80%;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-width:2px;
border-color:#006fa0;
padding:5px;
}

div.indent5
{
padding-left:5%;
}


div.firstdraft
{
color:#ff0000;
}

table.center
{
margin-left:auto;
margin-right:auto;
width:80%;
}


table.controls
{
margin-left:auto;
margin-right:auto;
width:90%;
}

table.two
{
width:400px;
}


tr.dk
{
background:yellow;
}

tr.lt
{
background:#ffffff;
}

/*span.right
{
position:relative;
right:-60%;
font-family:georgia;
font-size:12px;
color:#ffffff
}*/

span.left
{
font-family:georgia;
font-size:12px;
color:#ffffff
}

span.center
{
font-family:georgia;
font-size:16px;
color:#ffffff;
text-align:center
}

p.indent
{
padding-left:30px;
}

p.note
{
padding-left:40px;
color: #0030ff
}

span.type1 
{
font-family:arial;
font-size:24px;
color:#0000ff
}

div.menu 
{
margin-left:auto;
margin-right:auto;
background:#5A84AC;
border:none;
width:90%;
height:20px;
font-family:arial;
font-size:12px;
color:#cfcfcf;
text-align:left
}

button.controls
{
position:relative;
left:20px;
width:120px;
height:50px;
background:#5077be;
font-family:georgia;
font-size:16px;
color:#ffffff
}

a.g
{
/*color:#ff8500;*/
color:#ff6347;
/*color:#ffffff;*/
}

li {padding-left:5%}

li.indent5
{
padding-left:5%;
}

}
@media screen  and (min-width: 1024px) and (orientation:landscape)
{

body
{
background:#5A84AC;
}

div.main 
{
width:99%;
/*height:600px;*/
margin-left:auto;
margin-right:auto;
/*padding-left:10px;
padding-right:10px;*/
border-style:solid;
border-color:#800080;
border-width:2px;
background:#ffffff;
/*overflow:scroll*/
}

div.header 
{
width:100%;
margin-left:auto;
margin-right:auto;
font-family:georgia;
font-size:64px;
height:100px;
color:#ffffff;
background:#8db1f2;
}

div.content
 {
 margin-left:auto;
 margin-right:auto;
 width:90%;
 /*height:750px;*/
 padding:4%;
 border-style:solid;
 border-width:2px;
 border-color:#006fa0;
 background:#cfcfcf;
 font-family:georgia,serif;
 font-size:24px
 }
 
 div.colors
 {
 width:90%;
 margin-left:auto;
 }
 
div.controls
{
margin-left:auto;
margin-right:auto;
background:#cfcfcf;
width:75%;
height:50px;
padding-left:42px;
padding-top:10px;
border-style:solid;
border-width:2px;
border-color:#006fa0
}

div.indent5
{
padding-left:5%;
}

div.firstdraft
{
color:#ff0000;
}

table.center
{
margin-left:auto;
margin-right:auto;
width:50%;
}

table.controls
{
margin-left:auto;
margin-right:auto;
width:80%;
background:#cfcfcf;
}

table.two
{
width:90%;
}

tr.dk
{
background:yellow;
}

tr.lt
{
background:#ffffff;
}

span.right
{
position:relative;
right:-60%;
font-family:georgia;
font-size:16px;
color:#ffffff
}

span.left
{
font-family:georgia;
font-size:12px;
color:#ffffff
}

span.center
{
font-family:georgia;
font-size:16px;
color:#ffffff;
text-align:center
}

p.indent
{
padding-left:40px;
}


p.note
{
padding-left:40px;
color: #0030ff
}

span.type1 
{
font-family:arial;
font-size:24px;
color:#0000ff
}

div.impt
{
width:80%;
margin-left:auto;
margin-right:auto;
border-style:solid;
border-width:2px;
border-color:#006fa0;
padding:5px;
}

div.menu 
{
margin-left:auto;
margin-right:auto;
background:#5A84AC;
border:none;
width:90%;
height:20px;
font-family:arial;
font-size:16px;
color:#cfcfcf;
text-align:left
}

input.button 
{
margin-left:160px;
margin-top:10px;
width:85%;
height:40px;
background:#5077be;
font-family:georgia;
font-size:20px;
color:#ffffff
}

img.desktop2
{
position:relative;
right:-50px;
}

button.controls
{
position:relative;
left:20%;
width:75%;
height:30px;
font-family:arial;
font-size:18px
}

a.g
{
background:#ffffff;
/*color:#ff8500;*/
color:#ff6347;
/*color:#ffffff;*/
}

li.indent5
{
padding-left:40px;
}
}