/*drjang800.css */

body {background-color: #f0f0f0;}
a {color: #f0f0f0;text-decoration: none;} /*No underline in <a> tags*/

/*for menual*/
#hmenu{position: absolute;top: 20px;right:5px}
#hmenu ul {margin-left: -2.5em;}
#hmenu li {list-style-type: none;width: 7em;text-align: center;float: right;}
#hmenu a {text-decoration: none;color: black;display: block;
font: bold 16px  antiqua, serif;
background-color:  silver;
/*box-shadow: 5px 5px 5px gray;*/
margin-bottom: 2px;
margin-right: 2px;
border-radius: 5px;
}
/*#hmenu a:hover {background-color:  grey;}*/
#hmenu a:hover {background-color:  grey;}*/
#vmenu ul {margin-left: -2.5em;}
#vmenu li {list-style-type: none;text-align: left;align: left;}
#vmenu li span {display:inline-block; }
/*
#vmenu a {text-decoration: none;color: black;display: block;font: bold 25px  antiqua, serif;margin-bottom: 20px;margin-right: 2px;border-radius: 5px;border: 3px outset #EEEEFF;; padding: 0 10px;}
*/


#vmenu a {text-decoration: none;color: black;display: block;font: bold 25px  antiqua, serif;margin-bottom: 20px;margin-right: 2px;border-radius: 5px; padding: 0 10px;}

#vmenu a:hover {background-color:  grey;}


#vmenu2 ul {margin-left: -2.5em;}
#vmenu2 li {list-style-type: none;text-align: left;align: left;}
#vmenu2 li span {display:inline-block; }
#vmenu2 li ul {display: none;}
#vmenu2 li:hover ul {display: block;}
#vmenu2 a {text-decoration: none;color: black;display: block;font: 25px  antiqua, serif;margin-bottom: 5px;margin-right: 2px;border-radius: 5px;border: 3px outset #EEEEFF;; padding: 0 10px;}
#vmenu2 a:hover {background-color:  grey;}

#hmenu2{position: absolute;left:10px}
#hmenu2 ul {margin-left: -2.5em;}
#hmenu2 li {list-style-type: none;text-align:center; float:left; width: auto; display: block; padding: 0 10px;}

#hmenu2 a {text-decoration: none;color: black;display: block;font: 16px  antiqua, serif;}
#hmenu2 a:hover {background-color: #ddddee;}

/* end of menual*/


#top {border-bottom: 1px black solid;width: 99.6%;margin-top: -5px; min-height: 5em}
#top img {border-top: 5px;}

#middle{width: 99.6%; height: 400px;}

#middleC {width: 99.6%; height: 400px;}

#middle2 {width: 99.6%; height: 500px;}

#middle3 {width: 99.6%; height: 500px;}

#middle4 {width: 99.6%; height: 500px;}

#middle5 {width: 99.6%; height: 500px;}



#bottom {clear: both; width: 99.6%; text-align: center; border-top: 1px black solid; background-color: gray;min-height:5em; overflow:auto;}

#left {float: left; width: 67%;overflow: auto; border-right: 1px black solid; height: 100%;}
#left1 {float: left; width: 50%;overflow: auto; border-right: 1px black solid; height: 100%; min-width: 700px;}
#right {float: left;width: 32.3%; font: 17px  antiqua, serif;text-align: center;overflow: auto;height: 100%;}
#right a {font: bold 17px  antiqua, serif; color:blue; text-decoration: underline;}


#headname {	font: bold 30px  antiqua, serif;	position: absolute;left: 65px; top: 35px;  margin: 0px;}


#hq {font: italic bold 30px  antiqua, serif; text-align: left; margin-left: 10px;}


#floatleft {float: left;}


#img3 {clear: left;}


#right_head {font-size: 1.2em; }

/*.backg {background-image: url("../img/book_back_cover_pic2.jpg"); background-attachment: fixed;} */
/*.backg(background-color: #e6f9ff; background-attachment: fixed;)*/


.center {align: center; float: right; margin-right: 225px;}


.button2 {align: both;}
.button2 li {list-style-type: none; float: left; margin-left: 5px;}
.button2 button {font: bold 15px  antiqua, serif; display:inline-block; }
.button2 button:focus{background:#EEEEFF;}


.button3 {clear: left;}
.button3 li {list-style-type: none;}
.button3 button {font: bold 13px  antiqua, serif; margin-bottom: 5px; background:#EEEEFF;}
.button3 button:focus{background:red;}

/*For #left Menu defined*/
.cbp-hrmenu2 {width: 100%;border-bottom: 0px solid #47a3da; overflow:auto;}

/* general ul style */
.cbp-hrmenu2 ul {margin: 0;padding: 0;list-style-type: none;}

/* first level ul style */
.cbp-hrmenu2 .cbp-hrsub-inner {width: 95%;padding: 0 0.1em;}



.cbp-hrmenu2 > ul > li {
			border: 1px solid #AAA;
		    /*background: #D1D1D1;*/
				background: #92a8d1;
		    display: inline-block;
			/*z-index: 0;*/
		    border-top-left-radius: 6px;
		    border-top-right-radius: 6px;
		    margin: 0 -3px;
}

.cbp-hrmenu2 > ul > li > a {font: bold 18px  antiqua, serif;padding: 0em 0.3em;color:black; display: inline-block;text-align: center;}






/*For #left Menu defined*/
.cbp-hrmenu {width: 100%;border-bottom: 0px solid #47a3da; overflow:auto;}

/* general ul style */
.cbp-hrmenu ul {margin: 0;padding: 0;list-style-type: none;}

/* first level ul style */
.cbp-hrmenu .cbp-hrsub-inner {width: 95%;padding: 0 0.1em;}



.cbp-hrmenu > ul > li {
			border: 1px solid #AAA;
		    /*background: #D1D1D1;*/
				background: #92a8d1;
		    display: inline-block;
			/*z-index: 0;*/
		    border-top-left-radius: 6px;
		    border-top-right-radius: 6px;
		    margin: 0 -3px;
}

.cbp-hrmenu > ul > li > a {font: bold 18px  antiqua, serif;padding: 0em 0.3em;color:black; display: inline-block;text-align: center;}

.cbp-hrsub-inner,.cbp-hrmenu > ul > li > a:hover {color:dimgrey ;background:#D5DBDB;}

.cbp-hrsub-inner > div > ul > li > a:hover {color:dimgrey ;background:#D5DBDB;}
.cbp-hrmenu > ul > li.cbp-hropen a,.cbp-hrmenu > ul > li.cbp-hropen > a:hover {color: black; background:#D5DBDB;}

/* sub-menu */
.cbp-hrmenu .cbp-hrsub {display: none;position: absolute;width: 68%;left: 3px; /*border: 0px dashed  silver; border-width: 0px .1px  .1px .1px;*/}

.cbp-hropen .cbp-hrsub {display: block;padding-bottom: 0.5em;}

.cbp-hrmenu .cbp-hrsub-inner > div {width: 23%;float: left;padding: 0 1em 0;}

.cbp-hrmenu .cbp-hrsub-inner:before,.cbp-hrmenu .cbp-hrsub-inner:after {content: " ";display: table;}

.cbp-hrmenu .cbp-hrsub-inner:after {clear: both;}

.cbp-hrmenu .cbp-hrsub-inner > div a {line-height: 1em;font: 16px  antiqua, serif; }

.cbp-hrsub-inner > div > ul>li {clear:both;margin-bottom:6px;display: inline-block;float: left;}
.cbp-hrsub h4 {color: black;padding: 0.3em 0 0.3em;margin: 0;font-size: 20px;font-weight: bold;}



/* From here for diagnostic.html style*/

.startdig {float: left;font: bold 20px black;}

.startdig > ul > li{list-style-type: none; display: block; background-color:#c0c0c0;border-radius: 5px;}
.startdig > ul > li > a {font-size: 20px; color: black; margin-left:10px; margin-right:10px; margin-top:5px; margin-bottom:5px;}
.startdig >ul>li:hover {background-color:grey}




/*From here for start_diagnostic.html style*/

.leftq {clear: both; float: left;margin-left: 1px;width: 49%; height:300px; border: 3px outset #EEEEFF;overflow:no;background-color: #e5e7e9;}
.rightq {float: left;margin-left: 1px;width: 49%; height:300px; border: 3px outset #EEEEFF;background-color: #e5e7e9;}
.startdig2 {float: left;font: bold 16px black;margin-left:5px;}

/* From here for each lesson style*/
#hide1 {background-color: #4CAF50;}
.but1 {clear: both; color: black;font: bold 18px  antiqua, serif; margin-left: 30px;}
.but2 {clear: both; color: black;font: bold 18px  antiqua, serif; margin-left: 30px;}
#div1 {width:95%; height:500px; margin-left:30px;overflow:hidden;}
#div2 {display:none; width:98%%; height:300px; margin-left:10px; margin-right:10px;overflow:no;}
#div3 {display:none; width:98%%; height:300px; margin-left:10px; margin-right:10px;overflow:no;}
#div4 {display:none; width:98%%; height:300px; margin-left:10px; margin-right:10px;overflow:no;}


#shop a {text-align:center; color:blue; float:left;margin-left:6%;}
#shop a:hover {background-color: lightcyan;}


.obj1 {border: medium double #FFD700; margin-right: 20px;overflow:auto;}

.spq {background-color:#c0c0c0;border-radius: 5px; width: 250px; height:2.2em; margin-left: 50%;}
.spq > ul > li {list-style-type:none; display: block; margin-top:10x;}
.spq > ul > li> h2 {text-align: center; margin-left:-40px;opacity: 0.9;font: 900 150%/1.2 'Coming Soon', cursive;fill: url(#wall4);}
.spq > ul > li> h2 > a {color: black;}
.spq > ul > li > h2 >a:hover {color: blue;}
.section {float: left; margin-left:15%;}
.section > h2 {opacity: 0.9;font: 900 150%/1.2 'Coming Soon', cursive;fill: url(#wall4);}