

html, body {
    width:100%;
    margin:0px;
    padding:0px;
  }


.cookiebanner {
		position:static;
		bottom: 0;
  	left: 0;
    background-color: pink;
    width:100%;
    text-align:center;
    min-height:50px;
    padding-top:0px;
    margin-top:0px;
  }


#cityinfoid {
    display:inline-block;
  }


.ana1 {
    color : blue;
    font-size : x-large;
    padding-top : 20px;
    text-align : center;
  }


.ana2 {
    color : blue;
    font-size : large;
    text-align : center;
  }


.topbar {
    background-color : #696969;
    min-height : 34px;
    /* min-width : 34px;
    */ width : 100%;
    padding-top:1px;
    /* display:none;
    */;
  }


.topbarleft {
    text-align : left;
    min-width:1px;
    float:left;
  }


.topbarright {
    text-align : right;
    /* width :100%;
    */;
  }


.menu1head {
    color : black;
    font-size : 14px;
  }


.menubr {
    height : 8px;
    display:block;
  }


.biglink {
    color : #FCFCFC;
    font-family : Times New Roman;
    font-size : large;
    text-align : center;
  }


P {
    font-family : Times New Roman;
    color : Black;
  }


H1 {
    color : #dee2ff;
    font-size : 28pt;
    margin-top : 0px;
    padding-top : 0px;
  }


H2 {
    font-family : Arial;
    font-size : x-large;
    font-weight : bold;
    text-align : center;
  }


H3 {
    font-size : large;
    font-family : Arial;
    font-weight : bold;
    font-style : italic;
  }


A {
    color : black;
  }


A:Visited {
    color : #707070;
  }


A:Active {
    color : red;
  }


A:Hover {
    color : Red;
  }


BODY {
    background-color : #FCFCFC;
    color : Black;
    font-family : serif, Serif;
    font-size : 11pt;
  }


.center {
    text-align : center;
  }


.theader {
    background-color : #CCCCCC;
    padding-top : 20px;
    text-align : center;
    vertical-align : middle;
  }


.tred {
    background-color : #9966FF;
    height : 60px;
    text-align : center;
    vertical-align : middle;
    width : 162px;
  }


.right {
    text-align : right;
  }


.menu {
    font-size : x-small;
    list-style-type : decimal;
    color : Black;
    list-style : decimal;
  }


UL {
    list-style-type : square;
  }


LI {
    font-family : serif;
    font-size : 11pt;
  }


.container {
    display: table;
    width:100%;
    height:100%;
  }


.leftpanel {
    background-color : #888888;
    font-family : serif;
    font-size : 12pt;
    padding-left : 5px;
    padding-right : 5px;
    vertical-align : top;
    width : 162px;
    height:inherit;
    display:table-cell;
  }


.middlepanel {
    font-family : serif;
    font-size : 11pt;
    vertical-align : top;
    padding:0px;
    width:100%;
    height:inherit;
    display:table-cell;
    overflow:hidden;
  }


.middletext {
    padding-left : 5px;
    padding-right : 5px;
    width:auto;
  }


.rightpanel {
    background : #a0a0a0;
    font : 12pt serif;
    padding : 0 2px;
    color : #00008B;
    text-align : center;
    vertical-align : top;
    width : 188px;
    height:inherit;
    display:table-cell;
    overflow:hidden;
  }


.bottommenu {
    background : #888888;
    color : #00008B;
    text-align : left;
    /* min-width:210px;
    */ display:none;
  }


.clist {
    background-color : #555555;
    margin-bottom : 2px;
    outline-style : none;
    width : 200px;
  }


.download {
    width : 150px;
    height : 32px;
  }

/* -------------------- media */


.menu1 {
    font : 13px serif;
    color :black;
    min-height : 22px;
    width : 184px;
  }


.menu2 {
    font : 13px serif;
    color : black;
    min-height : 22px;
    width : 184px;
  }


.contexthelp {
    font : 12pt serif;
    padding : 10px 10px 10px 10px;
    border : #6699ff solid 1px;
    color : #000000;
    text-align : justify;
    /* width : 100%;
    */;
  }


.banner {
    background-color : #242424;
    background-image : url('/images/planets.png');
    background-position : right;
    background-repeat : no-repeat;
    color : #dee2ff;
    font-family : ;
    font-size : 28pt;
    height : 170px;
    padding-left : 32px;
    /* display:none;
    */;
  }


.bannerad {
    height:60px;
    width : 100%;
/*    vertical-align : top;*/
    text-align : center;
/*   overflow: hidden;*/
    background-color : #808080;
  }


#leftpanelid {
    display:inline-block;
  }


#bottommenuid {
    display:none;
  }


#rightpanelid {
    display:inline-block;
  }


.lotusid {
    width: 186px;
    height: 300px;
    background: url("/images/lt-186.jpg");
  }


.listbig {
    display:inline-block;
    min-height:22px;
  }


.listplace {
    display:inline-block;
    width:120px;
  }


.listsmall {
    display:none;
  }


#searchbox {
    width:46px;
    height:20px;
    font-size:10pt;
    margin:0px;
    padding:0px;
    -webkit-appearance: none;
    border-radius: 0;
  }


.searchbtn {
    width:20px;
    height:20px;
    background:transparent url(/images/icons/16x16/search.png) 0 0 no-repeat;
  }


.searchclear {
    width:20px;
    height:20px;
    background:transparent url(/images/icons/16x16/clear.png) 0 0 no-repeat;
  }


.topbutton {
    background-repeat: no-repeat;
    /* make the background image appear only once */ background-position: 0px 0px;
    /* equivalent to 'top left' */ background-color:white;
    /* equivalent to 'top left' */ border: none;
    /* assuming we don't want any borders */ cursor: pointer;
    /* make the cursor like hovering over an <a> element */ vertical-align: middle;
    /* align the text vertically centered */ font-size : 13px;
    height : 32px;
    text-align : center;
    min-width : 32px;
  }


.graphic {
    width:100%;
    max-width:600px;
    background-color:white;
    text-align:center;
  }

/*  1440×2560 2160×3840 */

@media only screen and  (max-width : 1240px) {
.listplace {
	display:none;
}
#leftpanelid {
    display:none;
  }
 }

/* 1080×1920 */
@media only screen and  (min-width :0px)  and (max-width : 1080px) {
 }

@media only screen and  (max-width :948px)  {
.banner {
    background-image : none;
    background-color : #030303;
    color : #dee2ff;
    font-family : ;
    font-size : 18pt;
    height : 100px;
    padding-left : 16px;
/*    display:none;*/
  }

.lotusid {
	display:none;
  background: none;
  }

#bottommenuid {
    display:block;
	}
#rightpanelid {
    display:none;
  }
.contexthelp {
    display:none;
  }
 /*
.integer {
    display:none;
  }
  TH {
    display:none;
  }
*/

}

@media only screen and  (max-width :772px)  {
.graphic {
}

}

/* 750×1334 */
@media only screen and  (max-width : 750px) {
.listbig {
	display:none;
}
.listsmall {
	display:inline-block;
  font-size : 14pt;
}

#searchbox {
 	width:60px;
 	height:36px;
 	font-size:14pt;
 	margin:0px;
 	padding:0px;
-webkit-appearance: none;
 border-radius: 0;
}
.searchbtn {
 	width:36px;
 	height:36px;
 	background:transparent  url(/images/icons/32x32/search.png) 0 0 no-repeat;
}
.searchclear {
 width:36px;
 height:36px;
 background:transparent  url(/images/icons/32x32/clear.png) 0 0 no-repeat;
}
}

@media only screen and  (max-width :762px)  {
.bannerad {
/*    background-color : yellow;*/
    text-align : inherit;
    max-height:92px;
  }
}

/* 720×1280 */
@media only screen and  (max-width :720px)  {
.topbutton {
    font-size : 16px;
    height : 30px;
  }

.menu1 {
    font-size : 15px;
    width : 230px;
    display:inline;
  }

.menu2 {
    font-size : 15px;
    width : 230px;
  }
}

/* 640×1136 */
@media only screen and  (max-width : 640px) {
.banner {
    display : none;
  }
.graphic {
}
}

@media only screen and  (max-width : 500px) {
.bannerad {
/*    min-width : 320px;*/
/*    text-align : center;*/
    max-height:92px;
  }
.graphic {
}

}

/* 480×800 */
@media only screen and  (max-width : 480px)  {
#tablebigid {
	display:none;
  }
.graphic {
}
}

@media only screen and  (max-width : 380px)  {
.graphic {
}
}

/* 240×320 */
@media only screen and  (max-width : 240px) {
}
/* 128×160 */
@media only screen and  (max-width : 128px) {
}

/****** natal *************/
@media only screen and  (min-width : 0px)  and (max-width : 620px) {
#tablebigid {
	display:none;
  }
#tablesmallid {
	display:block;
  }
}

@media only screen and  (min-width : 621px) {
#tablebigid {
	display:block;
  }
#tablesmallid {
	display:none;
  }
}