/*  主菜单 包括图片 但不包括 tab  最新  topbar 颜色  */
body {  background: #fbf7e7; font-family: sans-serif, Arial; font-size: 17px;}

#menu { background-color: #077;  color: #fff;  height: 37px; position:fixed; left:-2px; top:-17px; width:1400px}
#menu ol, #menu li { margin: 0 0; padding: 0 0; list-style: none；}

#menu li { float: left; display: inline; position: relative; font-size: 18px; border-right: 0px solid #444; border-left: 0px solid #111;}

#menu a { display: block; line-height: 30px; padding: 1px 20px; text-decoration: none; color: #eee;}
#menu li a:hover { background: #b99}
#menu ol.menus { height: auto; width: 175px; background: #28a; position: absolute; z-index: 99; display: none; border: 0;}
#menu ol.menus li { display: block; width: 100%; font-size:  17px; text-transform: none; box-shadow: 2px 3px 2px rgba(0,0,0,0.4); }

#menu li:hover ol.menus { display: block;}
#menu a.home { background: #c00;}

#menu ol.menus a:hover { background: #5aa;}
#menu ol.menus .submenu { display: none; position: absolute; left: 175px; background: #691; top: 0; width: 185px; }
#menu ol.menus .submenu li { background: #387;}
#menu ol.menus .has-submenu:hover .submenu { display: block;}

/* 主体文章格式 */
.quote {  padding: 4px 35px;  margin-top: 0px;  font-size:  20px ;  line-height: 1.5;/*  height: 170px; */}
.main {  padding: 4px 15px;  margin-top: 0px;  font-size:  18px;    line-height: 1.3;}

/* 用 logo 和标语 */
.topbar { width: 1400px; max-width:100%; height: 280px;	background: linear-gradient(to bottom right, rgb(250, 247, 237), rgb(255, 175, 0));margin-top:40px;}
.logo {	width: 33%;	height:	70%; padding-top:35px;	float:	left;}
.topphrase {font-size:1.6em; text-shadow: -0.13vw 0.13vw  #fff; color:rgb(0, 0, 170);
 padding-top: 35px; padding-left:35%; padding-right: 10%; float:center; }

/*  大图 和文字  */
.container { width: 1400px; max-width:100%; height: auto; position: relative; text-align: left; color: red; margin-top:38px;}
.centered { position: absolute; width:84vw; top: 26%; left: 50%; font-size: 3.7vw; text-shadow: 0.2vw 0.2vw  #fff; transform: translate(-50%, -50%);}
/*  end of image with text */

@media screen and (orientation:portrait) and (max-width:820px) {
/*   CSS for screens mobil but not tablet    */
    #menu {height: 31px;left:-42px;top:-20px;}
    #menu a {line-height: 29px; padding: 1px 5px;}
    #menu li { font-size: 14px ;}
    #menu ol.menus {width: 110px;}
	#menu ol.menus li {font-size: 14px ;}
	#menu ol.menus .submenu {left: 109px; width: 125px;}
	.quote {padding: 0px 2px; font-size:  16px;  }
	.main {padding: 0px 2px;  font-size:  16px;  }
	.topbar {	height:	140px;  margin-top:33px; }
	.logo { height:	70%; padding-top:20px;}
	.topphrase {font-size:0.9em; padding-top: 10px;padding-right: 6%; }
	.container {   height: auto;margin-top:29px;}
}

@media screen and (min-width:1200px){
    #menu {height: 41px;left:-2px;}
    #menu a {line-height: 41px; padding: 0px 30px;}
    #menu li { font-size: 21px ;}
    #menu ol.menus {width: 230px;}
	#menu ol.menus li {font-size: 18px ;}
	#menu ol.menus .submenu {left: 229px; width: 225px;}
	.main {  font-size:  19px;  }
    .topbar {height: 340px; margin-top:49px;}
    .topphrase {font-size:1.8em; padding-top: 40px;padding-right: 16%; }
    .container { margin-top:47px;}
	.centered { width:70vw; left: 55%; font-size: 3.2vw;   }
}