/* 
 * hustmain5.css
 * Created by Yidao Cai on 2016-09-22
 * Last modified: 2016-10-13
 * Copyright 2016 HUSTAA, All Rights Reserved.
 */
body {
  margin: 0;
  padding: 0;
  /* background: #f2f2f2; */
  /* background: #edfffe; */
  /* /common/logo/hust_kj2c2.gif */
  background: url("/common/logo/hust_elb1bs.gif");
  width: 100%;
  max-width: 1100px;
  min-width: 320px;
  font: 14px arial,helvetica,sans-serif;
}

.Global {
  width: auto;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}

.Content {
  /* background:  #f2f2f2; */
  /* background:  #edfffe; */
  color: inherit;
}

h2 {
  color: #3e3e3e; 
  font-family: arial,helvetica,sans-serif; 
  font-weight: bold;
  font-size: 20px; 
  line-height: 1.1; 
  text-align: center;
}

h4 {
  font-family: arial,helvetica,sans-serif; 
  font-weight: bold;
  text-align: center;
}

p {
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}


.ynp_title_blue { color: #205090; font-style: italic; }
.ynp_title_red { color: #aa6622; font-style: italic; }
.ynp_blue { color: #3333ff; }
.ynp_red { color: #ff1111; }
.ynp_grey { color: #555; }
.boldred { color: #ff1111; font-weight: bold; }
.boldblue { color: #3333ff; font-weight: bold; }
.question { color: #3333bb; font-weight: bold; }
.ynp_gold { color: #996600; }
.ynp_bold { font-weight: bold }
.dark05 { color: #051515; }
.dark555 { color: #555555; }
.c26a { color: #26a; }
.navtitle { color: #888822; font-family: arial,helvetica,sans-serif; font-size: 10pt; }

header {
  width: 100%;
  height: 138px;
  /* background: url("/logo/HeaderBackgroundc.png") repeat; */
  position: relative;
  margin: auto;
  /* border: 1px solid #AD5521; */
}

header.nonav { height: 88px; }
header.nobg { background: none; }
header.lightbg { background: #def; }

#logo {
  width: 240px;
  /* border: 1px solid #73AD21; */
  text-align: left;
  vertical-align: top;
  position: absolute;
  left: 1px;
  top: 10px;
}

#topmiddle {
  height: 70px;
  min-width: 50%;
  margin: 10px 160px 0px 240px;
  padding: 1px auto; 
  /* border: 1px solid #93AD21; */
  display: inline-block;
}
#topmiddle h2 {
  margin-top: 12px;
  margin-bottom: 6px;
  color: #0044ff;
}
#topmiddle p {
  font-size: 13.5px; 
  margin: 2px 5px; 
}


div .trwrapper {
  display: inline-block;
  margin: 0;
  position: absolute;
  right: 5px;
  top: 5px;
}
#topright {
  /*border: 1px solid #73AD21; */
  width: 155px;
  height: 78px;
  display: table-cell;
  text-align: right;
  vertical-align: bottom;
  font-size: 12px; 
  line-height: 1.5; 
  /*color: #136 */
  color: #2e2e2e;
  opacity: 0.7;
}
#topright div input { font-size: 11px; }
#topright div input.search { width: 100px; }

#topright a:link, 
#topright a:visited, 
#topright a:active {background: none; color: #001122; text-decoration: none;}
#topright a:hover {background: none; color: #ffffff; text-decoration: none;}

#topnav {
  margin: 1px auto;
  padding: 0px 5px; 
  position: relative;
  z-index: 100;
}

nav ul ul {
	display: none;
}

nav ul li:hover > ul {
	display: block;
}

nav ul {
	background: #fdd; 
	background: linear-gradient(top, #fdd 0%, #bbbbbb 100%);  
	background: -moz-linear-gradient(top, #fdd 0%, #bbbbbb 100%); 
	background: -webkit-linear-gradient(top, #fdd 0%,#bbbbbb 100%); 
	box-shadow: 0px 0px 9px rgba(0,0,0,0.45);
	/* padding: 0 auto; */
	padding: 0 5px;
	border-radius: 6px;  
	list-style: none;
	position: absolute; 
	/* display: inline-block; */
        font-size: 15px;
}
nav ul:after {
	content: ""; clear: both; display: block;
}


nav ul li {
	float: left;
	/*display: inline;*/
}
nav ul li:hover {
	background: #e5905f;
	background: linear-gradient(top, #e5905f, 0%, #3c83db 70%);
	background: -moz-linear-gradient(top, #e5905f 0%, #3c83db 70%);
	background: -webkit-linear-gradient(top, #e5905f 0%, #3c83db, 70%);
}
nav ul li:hover a {
	color: #fff;
}
	
nav ul li a {
	display: block; padding: 8px 40px;
	color: #655; text-decoration: none;
	/*color: #9d7575; text-decoration: none;*/
}

nav ul ul {
	/* background: #215187; border-radius: 0px; padding: 0;*/
	background: #3c83db; border-radius: 0px; padding: 0;
	position: absolute; top: 90%;
}
nav ul ul li {
	float: none; 
	border-top: 1px solid #9d727c;
	border-bottom: 1px solid #9d5f6a;
	position: relative;
}
nav ul ul li a {
	padding: 10px 40px;
	color: #fff;
}	
nav ul ul li a:hover {
	background: #ba884d;
}

nav ul ul ul {
	position: absolute; left: 100%; top:0;
}

div .bodywrapper {
  width: 100%;
  display: inline-block;
  height: auto;
  /*float:left;*/
  margin: 0;
}


#bodycontent {
  width: 79%;
  display: inline-block;
  /*border: 1px solid #73AD21; */
  text-align: left;
  vertical-align: top;
  position: relative;
  z-index: 0;
}

#bodycontent a:link {background: none; color: #0066dd; text-decoration: none;}
#bodycontent a:visited  {background: none; color: #03e; text-decoration: none;}
#bodycontent a:hover  {background: none; color: #1199cc; text-decoration: underline;}
#bodycontent a:active  { background: none; color: #ffffff; background: underline;}

#bodycontent article {
  padding: 1px 5px;
  /*border: 1px solid #73AD21; */
}

#bodycontent h2 {
  color: #345; 
  font-family: arial,helvetica,sans-serif; 
  font-weight: bold;
  font-size: 20px; 
  line-height: 1.0; 
  text-align: center;
  margin: 0;
  padding: 5px 1px 5px 1px;
  /*border: 1px solid #73AD21;*/
}

#bodycontent h3 {
  /*color: #248; 
  background: #8df;
  */
  color: #850;
  /* background: #baf3fa; */
  /* background: #99e8f8; */
  background: #88ffdd;
  padding: 8px;
  font-family: arial,helvetica,sans-serif; 
  font-weight: bold;
  font-size: 15px; 
  /*border: 1px solid #73AD21; */
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}
#bodycontent h4 {
  color: #520;
  font-size: 14px; 
  text-align: left;
  padding-left: 5px;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}

#bodycontent h4.sample {
  color: #155;
  font-size: 14px; 
  text-align: center;
}

#bodycontent p {
  padding: 1px 0px;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}

#sidecontent ol, #sidecontent ul,
#bodycontent ol, #bodycontent ul {
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}
#bodycontent li {
  padding-top: 3px;
  padding-bottom: 2px;
}

#pagenav {
  padding: 5px;
  color: #888822;
  text-decoration: none;
  font-size: 12px;
}
#pagenav a:link,
#pagenav a:visited { color: #888822; text-decoration: none}
#pagenav a:hover {background: none; color: #b5b5b5; }

#gbeng {
  position: absolute;
  right: 42px;
  top: 5px;
}

#gplus {
  position: absolute;
  right: 2px;
  top: 2px;
}

#fullsc {
  position: absolute;
  right: 5px;
  top: 5px;
  background: #b5e5e5;
  padding: 1px 6px;
}

#modified, #created {
  padding: 5px;
  color: #757575;
  text-decoration: none;
  font-size: 12px;
  text-align: right;
}

input.button {
  padding: 6px 30px;
  color: #222;
  background: #2e9;
  border-radius: 8px;
  text-decoration: none;
  font-weight: bold;
  font-size: 15px; 
  text-align: center;
}

#bodycontent figure { 
  position: relative; 
  display: inline-block; 
  width: 100%;
  height: auto;
  margin: 0;
  padding: 8px 0px;
}
#bodycontent figure figcaption { 
  padding: 8px 1px 5px 5px;
  font-size: 12px;
  background-color: rgba(255,255,255,0.6);
  opacity: 0.6; 
}

.thumbbox {
    display: inline-block;
    width: 23%;
    max-width: 200px;
    margin: 10px 6px;
    /* border: 1px solid #73AD21; */
    text-align: left;
    vertical-align: top;
}

#bodycontent p.thumbnav {
  background: #5fe;
  padding: 6px;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
  opacity: 0.65;
}

#bodycontent p.pretitle, 
#bodycontent p.subtitle {
  text-align: center;
  color: #29f;
  font-size: 13px;
  padding: 0;
  margin-top: 0.2em;
  margin-bottom: 0;
}

#bodycontent div.navimgs { opacity: 0.8; }
#bodycontent img.navimgs { width: 40px; height: 25px; }


#bodycontent table { border: 1px solid #edfffe; width: 99%; font-size: 10pt; background: #edfffe; margin-bottom: 5px; }
/*
 #bodycontent table { border: 1px solid #ffaa33; width: 99%; font-size: 10pt; background: #edfffe; margin-bottom: 5px; }
 */
#bodycontent table tr { background-color: #edfffe;}
#bodycontent table tr.eaeaff { background-color: #eaeaff;}
#bodycontent table tr.e8e8ff { background-color: #e8e8ff;}
#bodycontent table tr.ddeeff { background-color: #ddeeff;}
#bodycontent table tr.heading { background-color: #e8e8ff; text-align: center; }
#bodycontent table th { padding: 5px }
#bodycontent table td { padding: 5px }

#apply table, #bodycontent table.noborder { border-collapse: collapse; border: 0; }

#bodycontent table.tmn { border: 1px solid #ffddaa; }
#bodycontent table td.tmn { background-color: #e8e8ff; padding-right: 5px; }


#sidecontent {
  display: inline-block;
  /* display: table-cell; */
  width: 20%;
  float: right;
  background:rgba(250, 240, 230, 0.5);
  /* background: #fef6e2; */
  /* border: 1px solid #73AD21; */
  /* background: #c8f8f8; */
  /* background: #73AD21; */
  font: 13px arial,helvetica,sans-serif;
  z-index: 0;
}
#sidecontent div {
  padding: 5px;
  /*height: 50px;*/
}

#sidenav ul {
  list-style-type: square;
  padding-left: 20px;
  color: #775;
}

#sidecontent a:link {background: none; color: #0066dd; text-decoration: none;}
#sidecontent a:visited  {background: none; color: #03e; text-decoration: none;}
#sidecontent a:hover  {background: none; color: #1199cc; text-decoration: underline;}
#sidecontent a:active  { background: none; color: #ffffff; background: underline;}

#sidenav a:link, 
#sidenav a:visited {background: none; color: #4f4f4f; text-decoration: none;}
#sidenav a:hover {background: none; color: #1199cc; text-decoration: underline;}
#sidenav a:active { background: none; color: #ffffff; background: underline;}


.samplebox, .warnbox { 
  background: #ffddaa;
  margin: 10px;
  padding: 5px;
}
.warn { color: #ff0000; }
.em90 { font-size: 0.9em }
.em80 { font-size: 0.8em }
.em70 { font-size: 0.7em }

span.nobr { white-space: nowrap; }

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



footer {
  width: 100%;
  background:rgba(250, 240, 248, 0.45);
  /* background: #fefbf2; */
  /* background: #d2ffff; */
  color: inherit;
  font: 14px arial,sans-serif;
}
footer p.filler { font-size: 1px; color: #eee; margin: 0;}

.fbox {
    display: inline-block;
    width: 180px;
    margin: 10px 6px;
    border: 1px solid #73AD21; 
    text-align: left;
    vertical-align: top;
}

footer div ul {
  list-style-type: none;
  padding-left: 15px;
}

footer div li {
  padding: 4px 0px 0px 0px;
}

footer div a:link,
footer div a:visited {background: none; color: #555; text-decoration: none;}
footer div a:hover {background: none; color: orange; text-decoration: underline;}
footer div a:active { background: none; color: #fff; background: underline;}

#copyright
{
  /* background: url("/logo/FooterBackgroundc.png") repeat; */
  width: 100%;
  height: 70px;
  margin: auto
  padding: 5px;
  position: relative;
}
#copyright .wrapper
{
  font-family: 'Open Sans', sans-serif;
  padding: 2px 2px 5px 5px;
  color: #3e3e3e;
  font-size: 13px;
  position: relative;
}


.hidden
{
  position: absolute;
  /* clip: rect(1px 1px 1px 1px); IE6 & 7 */
  clip: rect(1px, 1px, 1px, 1px);
}

#bodycontent div.ads {
  margin: 10px 2px;
  width: 100%; 
  min-height: 120px; 
  max-height: 320px; 
  border: 1px solid #adf; 
}
#bodycontent div p.sponsored {
  text-align: right;
  color: #abb;
  font-size: 9px;
  padding: 1px 6px;
  margin: 0;
}


#bodycontent table.summary, 
#bodycontent table.feesummary,
#bodycontent table.application
{ width: 100%; color: #000000; background: #efe; border: 1px solid #66aaff; font-family: arial, helvetica,sans-serif; font-size: 10pt; line-height: 1.1; text-decoration: none }
#bodycontent table th { text-align: center; }

#bodycontent tr.applheading { background: #ccddee; }
#bodycontent tr.applrow { background: #ddeeff; }

 .item_name { color: #000000; font-family: arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }

/* forum specific */
.fade07 { opacity: 0.7; }
.fade05 { opacity: 0.5; }
.user { color: #326; font-weight: bold; }
.keywords { white-space: nowrap; font-size: 0.9em; color: #555; }
.pbutton {
  padding: 3px 12px;
  color: #222;
  background: #6e9;
  border-radius: 3px;
  text-decoration: none;
  font-weight: bold;
  font-size: 15px; 
  text-align: center;
}
#bodycontent p.forumheading { color: #111; font-weight: bold; text-align: center; }
#bodycontent table.forumidx {
  width: 100%;
  padding: 2px 5px;
  margin-bottom: 15px;
  background-color: #ffeeff;
  /* border: 1px solid #abb; */
}
#bodycontent table tr.forumidx {
  background-color: #eeeeff;
}
#bodycontent table.forumidx ul {
    margin-top: 0.5em;
    margin-bottom: 0.1em;
}
#bodycontent div.forumidx {
  font-size: 13px;
  text-align: center;
  padding: 2px 5px;
  margin-bottom: 8px;
  background:rgba(240, 251, 249, 0.55);
  /* background-color: #f2fefc; */
  /* border: 1px solid #abb; */
}
#bodycontent div.highlights {
    display: inline-block;
    width: 46%;
    margin: 2px 5px;
    /* border: 1px solid #73AD21; */
    text-align: left;
    vertical-align: top;
}
#followup { opacity: 0.8; margin-top: 15px; }
#bodycontent div.imgupload {
  border: 1px solid #73AD21; 
  padding: 4px;
  margin: 6px 2px;
  background: #fdf5fd;
  opacity: 0.7;
}


/* MEDIA QUERIES FOR A RESPONSIVE LAYOUT */
@media print 
{
  header { height: 80px; }
  #bodycontent { width: 100%; }
  .fbox, #topnav, #sidecontent 
  {
    display: none !important;
    /*height: 0;*/
  }
}


@media screen and (max-width: 1015px)
{
  header { height: 138px; }
  /*#topmiddle { padding: 1px 100px 0px 0px; }*/
  nav ul { font-size: 16px; }
  nav ul li a {
	display: block; padding: 8px 40px;
  }
  h2 { font-size: 20px; }
  .thumbbox { margin: 5px 4px; }
}

@media screen and (max-width: 900px)
{
  header { height: 138px; }
  #topmiddle { min-width: 42%; }
  #topmiddle p { font-size: 13px;}
  nav ul { font-size: 16px; }
  nav ul li a {
	display: block; padding: 8px 30px;
  }
  h2 { font-size: 20px; }
  #bodycontent { width: 74% }
  #sidecontent { width: 25% }
  .thumbbox { margin: 5px 3px; }
}

@media screen and (max-width: 800px)
{
  header { height: 132px; }
  #logo { width: 200px; }
  #topmiddle { 
    min-width: 48%;
    /*padding: 1px 30px 0px 5px; */
    height: 65px;
    margin: 5px 120px 0px 200px;
  }
  #topmiddle h2 { font-size: 17px;}
  #topmiddle p { font-size: 12px;}
  #topright  { width: 125px; height: 68px;}
  #topright div input { font-size: 10px; }
  #topright div input.search { width: 70px; }
  /* #topright, */ #fullsc {
    position: absolute;
    /* clip: rect(1px 1px 1px 1px);  IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
  }
  nav ul { font-size: 15px; }
  nav ul li a {
	display: block; padding: 7px 20px;
  }
  nav ul ul li a { padding: 10px 25px; }
  h2 { font-size: 19px; }
  #bodycontent, #sidecontent { width: 100% }
  #sidenav ul { padding-left: 28px; }
  .thumbbox { margin: 5px 3px; }
}

@media screen and (max-width: 640px)
{
  header { height: 125px; }
  #logo { width: 200px; }
  #topmiddle { 
    min-width: 60%;
    /*padding: 1px 10px 0px 20px; */
    height: 60px;
    margin: 2px 0px 0px 200px;
  }
  #topmiddle p { font-size: 11px; margin: 2px 5px; }
  div .trwrapper { left: 5px; top: 5px; }
  #topright, #fullsc {
    position: absolute;
    /* clip: rect(1px 1px 1px 1px);  IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
  }
  nav ul { font-size: 14px; }
  nav ul li a {
	display: block; padding: 6px 10px;
  }
  nav ul ul li a { padding: 10px 15px; }
  h2 { font-size: 17px; }
  #bodycontent h2 { font-size: 15px; }
  #bodycontent p.pretitle, #bodycontent p.subtitle { font-size: 11px; }
  #bodycontent, #sidecontent { width: 100% }
  #sidenav ul { padding-left: 28px; }
  #bodycontent ul, #bodycontent ol, #bodycontent ul ol { padding-left: 20px; }
  #apply table ul, #apply table ol { padding-left: 15px; }
  /* #bodycontent figure { margin-left: 2px; padding-left: 1px; }*/
  /* #bodycontent figure img { max-width: 350px; } */
  #bodycontent article { padding: 1px 1px; }
  .samplebox, .warnbox { margin: 5px 0px; }
  .thumbbox { width: 23%; margin: 5px 2px; }
}

@media screen and (max-width: 540px)
{
  header { height: 105px; }
  #logo { width: 180px; }
  #topmiddle { 
    min-width: 56%;
    padding: 1px 2px 0px 2px; 
    height: 50px;
    margin: 2px 0px 0px 180px;
  }
  #topmiddle h2 { font-size: 15px; margin-top: 10px; }
  #topmiddle p { font-size: 10px; margin: 2px 5px; }
  div .trwrapper { left: 5px; top: 5px; }
  #topright, #fullsc {
    position: absolute;
    /* clip: rect(1px 1px 1px 1px);  IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
  }
  #topnav { padding: 0px 0px; margin-top: 1px; }
  nav ul { font-size: 13px; }
  nav ul li a {
	display: block; padding: 6px 8px;
  }
  nav ul ul li a { padding: 10px 15px; }
  #bodycontent h2 { font-size: 15px; }
  #bodycontent, #sidecontent { width: 100% }
  #bodycontent div.forumidx, #pagenav { font-size: 11px; }
  #sidenav ul { padding-left: 25px; }
  #bodycontent ul, #bodycontent ol, #bodycontent ul ol { padding-left: 20px; }
  #apply table ul, #apply table ol { padding-left: 10px; }
  /* #bodycontent figure { margin-left: 2px; padding-left: 1px; } */
  /* #bodycontent figure img { max-width: 350px; } */
  #bodycontent article { padding: 1px 1px; }
  .samplebox, .warnbox { margin: 5px 0px; }
  .thumbbox { width: 31%; margin: 5px 2px; }
  footer div ul { padding-left: 8px; }
  .fbox { width: 168px; margin: 10px 4px 10px 3px;}
  #copyright { height: 90px; }
}

@media screen and (max-width: 460px)
{
  header { height: 105px; }
  #logo { width: 160px; }
  #topmiddle { 
    min-width: 55%;
    padding: 1px 2px 0px 2px; 
    height: 50px;
    margin: 2px 0px 0px 160px;
  }
  #topmiddle h2 { font-size: 14px; margin-top: 10px; }
  #topmiddle p { font-size: 8.5px; margin: 2px; }
  div .trwrapper { left: 5px; top: 5px; }
  #topright, #fullsc {
    position: absolute;
    /* clip: rect(1px 1px 1px 1px);  IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
  }
  #topnav { padding: 0px 0px; margin-top: 1px; }
  nav ul { font-size: 12px; }
  nav ul li a {
	display: block; padding: 6px 4px;
  }
  nav ul ul li a { padding: 10px 15px; }
  #bodycontent h2 { font-size: 15px; text-align: left; }
  #bodycontent, #sidecontent { width: 100% }
  #bodycontent div.forumidx, #pagenav { font-size: 10px; }
  #sidenav ul { padding-left: 25px; }
  #bodycontent ul, #bodycontent ol, #bodycontent ul ol { padding-left: 10px; }
  #apply table ul, #apply table ol { padding-left: 10px; }
  /* #bodycontent figure { margin-left: 2px; padding-left: 1px; } */
  /* #bodycontent figure img { max-width: 350px; } */
  #bodycontent article { padding: 1px 1px; }
  .samplebox, .warnbox { margin: 5px 0px; }
  .thumbbox { width: 47%; margin: 5px 2px; }
  footer div ul { padding-left: 8px; }
  .fbox { width: 168px; margin: 10px 4px 10px 3px;}
  #copyright { height: 90px; }
}

@media screen and (max-width: 390px)
{
  header { height: 95px; }
  #logo { width: 120px; }
  #topmiddle { 
    min-width: 62%;
    padding: 1px 3px 0px 3px; 
    height: 50px;
    margin: 2px 0px 0px 120px;
  }
  #topmiddle h2 { font-size: 13px; margin-top: 10px; }
  #topmiddle p { font-size: 8px; margin: 2px 2px; }
  div .trwrapper { left: 5px; top: 5px; }
  #topright, #fullsc {
    position: absolute;
    /* clip: rect(1px 1px 1px 1px);  IE6 & 7 */
    clip: rect(1px, 1px, 1px, 1px);
  }
  #topnav { padding: 0px 0px; margin-top: 1px; }
  nav ul { font-size: 11px; margin-top: 2px; }
  nav ul li a {
	display: block; padding: 6px 2px;
  }
  nav ul ul li a { padding: 6px 10px; }
  #bodycontent h2 { font-size: 14px; text-align: left; }
  #bodycontent, #sidecontent { width: 100%; font-size: 12px; }
  #pagenav { font-size: 9px; }
  #sidenav ul { padding-left: 25px; }
  #bodycontent ul, #bodycontent ol, #bodycontent ul ol { padding-left: 10px; }
  #apply table ul, #apply table ol { padding-left: 10px; }
  #bodycontent article { padding: 1px 1px; }
  .samplebox, .warnbox { margin: 2px 0px; }
  .thumbbox { width: 47%; margin: 5px 2px; }
  footer div ul { padding-left: 8px; }
  .fbox { width: 168px; margin: 10px 4px 10px 3px;}
  #copyright { height: 90px;}
  #copyright .wrapper { font-size: 11px; }
}



