

body{
margin-left:5%;
margin-right:5%;
background-color: #C9ccF3;
pacity:.90;

}

#head{
font-size: 3em;
border-bottom: 5px solid black;
margin-bottom: 2%;
}
#Bshell{
width:80%;
height:1500px;
margin-left:10%;
margin-right:10%;
background-color: #C9EAF3;
pacity:.90;

}

#top{
width: 100%;
height: 75px;
border: 1px solid black;
margin: 0%;
margin-top: .5%;
text-align: center;
background-color: black;
color: white;
}




#li{
position: relative;
font-size: 1em;
margin: 5;
padding: 5;
top: 3px;
margin-left: 33%;
}



ul#menu, ul#menu ul.sub-menu {
    padding: 0;
    margin: 0;
}
ul#menu, ul#menu ul a:hover {
    padding: 0;
    margin: 0;
	

}
ul#menu li, ul#menu ul li {
    list-style-type: none;
	font-size: 2.5em;
	text-align: center;
	display: inline-block;
	padding: .15%;
}
ul#menu li, ul#menu ul li  a:hover{
    list-style-type: none;
	display: inline-block;
	padding: 1;

}

/*Link Appearance*/
ul#menu li a, ul#menu li ul.sub-menu li a:hover {
    text-decoration: none;
    color: #fff;
    background: #000033;
    padding: 10px;
	width: 32px;
	height: 35px;
    display:inline-block;
	border-radius: 50%;
	
}
ul#menu li a:hover, ul#menu li ul.sub-menu li a:hover {
    color: yellow;
	background: grey;
    padding: 10px;
	width: 35px;
	height: 35px;
    display:inline-block;
	
	
}

/*Make the parent of sub-menu relative*/
ul#menu li {
    position: relative;

}

#top ul li{
display: inline-block;
list-style-type: none;
position: relative;
font-size: 24px;
padding: 2px;
}

#top ul li a{
text-decoration: none;
padding: .2em 1em;
color:white;
}
#top ul li a:hover{
color: yellow;
background-color: grey;
}
#b1{
width: 95%;
height: 1150px;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
border: 1px solid black;
}
#art0{
	float: right;
	top: ;
   width: 33%;
   margin: 1%;
   height: 950px;
   background: ;
   border: 1px solid black;
   position: relative;
   -moz-border-radius:    5px;
   -webkit-border-radius: 5px;
   border-radius:        ;
}
#imgT{
float: left;
height: 15%;
width: 40%;
border: 2px solid black;
margin: 3px;
background-size:cover;
}



#typeBox{
float: left;
width: 63%;
height: 350px;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;
font-size: 22px;
border: 1px solid grey;
color: white ;
background-color:black;
}
#fadeText{
float: left;
width: 63%;
height: 400px;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;

border: 1px solid grey;
color: white ;
background-color:black;

}
#fadeText1{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 34px;
color: white;
}
#fadeText2{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 34px;
color: blue;
}
#fadeText3{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 34px;
color: yellow;
}
#fadeText4{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 34px;
color: blue;
}
#adeText p {
    opacity: 0;
    margin-top: 25px;
    font-size: 30px;
	font-family: Swiss;
	color: white;
    text-align: center;
    -webkit-transition: opacity 4s ease-in;
    -moz-transition: opacity 4s ease-in;
    -o-transition: opacity 4s ease-in;
    -ms-transition: opacity 4s ease-in;
    transition: opacity 4s ease-in;
}
#adeText p.load {
    opacity: 1;
}







#Definition{
float: left;
width: 28%;
height: 700px;
margin-left: 1%;
margin-top: 1%;
margin-right: 1%;
font-size: 22px;
border: 3px solid grey;
color: black;
padding: 0%;
background-color: ;
}

.p5{
color: red;
font-size: 2.5em;
line-height:0%;
}
.p6{
color: black;
font-size: .7em;

}
.p7{
color: green;
font-size: 1em;
font-weight: bold;
}
.p8{
color: red;
font-size: 1.2em;
font-weight: bold;
}



/* box fonts */
.p10{
font-size: 3em;
color: red;
padding: 9%;
float: center;
font-family: impact;
}
.p11{
font-size: 1.5em;
color: red;
padding: 9%;
float: center;
font-family: impact;
}
.p12{
font-size: 2em;
color: blue;
padding: 9%;
float: center;
font-family: comic sans;
font-weight: bold;
}
.p13{
font-size: 2.5em;
color: blue;
padding: 9%;
float: center;
margin-top:2%;
font-family: comic sans;
font-weight: bold;
}


#LowColumn{
width: 33%;
float: right;
height: 55%;
argin-left: 2%;
margin-top: 10%;
margin-right: ;
border: 1px solid black;
}
#topLow{
width: 100%;
height: 30px;
border: 1px solid black;
margin: 0%;
margin-top: 0%;
text-align: center;
background-color: black;
color: white;
}


/***Scroll Section**/


#wrap{
height:20%;

}

div#status{}
div#wrap{width:95%; margin:0px auto;}
div.newData{height:600px;font-size: 2em; background:#E0E0E0;background-size: cover; margin:10px 0px;}
div.newData .inner{height:50%; width: 30%; float: right; background:#E0E0E0;background-size: cover; margin:10px 0px; border: 5px solid black;}

div.newData0{height:600px;font-size: 1.2em; background:#99ccff; color: ;  margin:10px 0px;}
div.newData1{height:600px;font-size: 1.2em; background:#E0E0E0; margin:10px 0px; border: 5px solid black;}
div.newData1 img{height:25%; width: 30%; margin: 1%; border: 5px solid black;}

div.newData2{height:600px;font-size: 1.2em; background:#99ccff; color: ;  margin:10px 0px;}
div.newData2 .inner{height:90%; width: 30%; float: right; background:#E0E0E0;background-size: cover; margin:1% 2%; border: 5px solid black;}
/*div.newData3{height:600px;font-size: 1.2em; background:#E0E0E0; margin:10px 0px; border: 5px solid black;}*/

div.newData3{height:600px;font-size: 24px; background:#E0E0E0; margin:10px 0px; border: 5px solid black;border-radius:2%; }
div.newData4{height:600px;font-size: 1.2em; background:#99ccff; color: ;  margin:10px 0px;}
div.newData5{height:600px;font-size: 1.2em; background:#91ccff; color: ;  margin:10px 0px;}
div.newData6{height:600px;font-size: 1.2em; background:white; margin:10px 0px; border: 5px solid black;}
div.newData7{height:600px;font-size: 1.2em; background:#99ecgf; color: ; border: 5px solid black; margin:10px 0px;}
div.newData8{height:600px;font-size: 1.2em; background:#99ecgf; color: ; border: 5px solid black; margin:10px 0px;}
div.newDataVid{height:800px;font-size: 1.2em; background:#99ecgf; color: ; border: 5px solid black; margin:10px 0px;}


.newData2{height:600px;font-size: 1.2em; background:#99ccff; color: ;  margin:10px 0px;}
.newData3{height:600px;font-size: 1.2em; background:#E0E0E0; margin:10px 0px; border: 5px solid black;}


#content{width:90%; height:600px; margin:0px auto;}

.inner-right{height:95%; width: 30%; float: right; background:#E0E0E0;background-size: cover; margin:1% 2%; border: 5px solid black;}
.center{height:95%; width: 30%; float:left ; background:#E0E0E0; background-size: cover; margin:1% auto ; border: 1px solid black;}
.inner-left{height:95%; width: 30%; float: left; background:#E0E0E0; background-size: cover; margin:1% 2%; border: 5px solid black;}
.inner-big-left{height:95%; width: 60%; float: left; background:#E0E0E0; background-size: cover;margin:1% 2%; border: 5px solid black;}
.inner-big-right{height:95%; width: 60%; float: right; background:#E0E0E0;background-size: cover; margin:1% 2%; border: 5px solid black;}

p.foot{
font-size: 1em;
float;
}









/* Media Queries
================================= */

@media (max-width: 991px) {
	body{
margin-left:0%;
margin-right:0%;
background-color: #C9ccF3;
pacity:.90;

}
#head{
font-size: 2em;
border-bottom: 5px solid black;
margin-bottom: 2%;
}
#Bshell{
width:100%;
height:80%;
margin-left:0%;
margin-right:0%;
background-color: #C9EAF3;
pacity:.90;

}

#top{
width: 100%;
height: 10%;
border: 1px solid black;
margin: 0%;
margin-top: .5%;
text-align: center;
background-color: black;
color: white;
}
#li{
position: relative;
font-size: 1em;
margin: 5;
padding: 5;
top: 3px;
margin-left: 33%;
}



ul#menu, ul#menu ul.sub-menu {
    padding: 0;
    margin: 0;
}
ul#menu, ul#menu ul a:hover {
    padding: 0;
    margin: 0;
	

}
ul#menu li, ul#menu ul li {
    list-style-type: none;
	font-size: 1em;
	text-align: center;
	display: inline-block;
	padding: .15%;
}
ul#menu li, ul#menu ul li  a:hover{
    list-style-type: none;
	display: inline-block;
	padding: 1;

}
ul#menu li a, ul#menu li ul.sub-menu li a:hover {
    text-decoration: none;
    color: #fff;
    background: #000033;
    padding: 15px;
	width: 5px;
	height: 5px;
    display:inline-block;
	border-radius: 50%;
	
}
ul#menu li a:hover, ul#menu li ul.sub-menu li a:hover {
    color: yellow;
	background: grey;
    padding: 15px;
	width: 35px;
	height: 35px;
    display:inline-block;
	
	
}

/*Make the parent of sub-menu relative*/
ul#menu li {
    position: relative;

}


#top ul li{
display: inline-block;
list-style-type: none;
position: relative;
font-size: 1.5em;
padding: .1%;
}

#top ul li a{
text-decoration: none;
padding: .2em 1em;
}
#top ul li a:hover{
color: yellow;
background-color: grey;
}

#b1{
width: 100%;
height: 100%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
border: 1px solid black;
}


#art0{
	float: right;
	top: ;
   width: 33%;
   margin: 1% auto;
   height: 70%;
   background: ;
   border: 1px solid black;
   position: relative;
   -moz-border-radius:    5px;
   -webkit-border-radius: 5px;
   border-radius:        ;
}

#imgT{
float: left;
height: 10%;
width: 25%;
border: 2px solid black;
margin: 3px;
}
#typeBox{
float: left;
width: 63%;
height: 350px;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;
font-size: 22px;
border: 1px solid grey;
color: white ;
background-color:black;
}
#fadeText{
float: left;
width: 60%;
height: 35%;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;

border: 1px solid grey;
color: white ;
background-color:black;

}
#fadeText1{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 1.35em;
color: white;
}
#fadeText2{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 1.35em;
color: blue;
}
#fadeText3{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 1.35em;
color: yellow;
}
#fadeText4{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 1.35em;
color: blue;
}
#adeText p {
    opacity: 0;
    margin-top: 25px;
    font-size: 30px;
	font-family: Swiss;
	color: white;
    text-align: center;
    -webkit-transition: opacity 4s ease-in;
    -moz-transition: opacity 4s ease-in;
    -o-transition: opacity 4s ease-in;
    -ms-transition: opacity 4s ease-in;
    transition: opacity 4s ease-in;
}
#adeText p.load {
    opacity: 1;
}







#Definition{
float: left;
width: 29%;
height: 600px;
margin-left: 1%;
margin-top: .5%;
margin-right: 1%;
font-size: 2em;
border: 2px solid grey;
color: black;
padding: 0%;
background-color: ;
}

.p5{

color: red;
font-size: .8em;
line-height:0%;
}
.p6{
color: black;
font-size: .4em;

}
.p7{
color: green;
font-size: .5em;
font-weight: bold;
}
.p8{
margin-top: 4%;
color: red;
font-size: .7em;
font-weight: bold;
}





#LowColumn{
width: 28%;
float: right;
height: 30%;
argin-left: 2%;
margin-top: 5%;
margin-right: 5%;
border: 1px solid black;
}
#topLow{
width: 100%;
height: 10%;
border: 1px solid black;
margin: 0%;
margin-top: 0%;
text-align: center;
background-color: black;
color: white;
}
 
.slide-img{
height: 50%;
width:75%;
}


#wrap{
float: right;
margin-top:1%;
position: relative;
height:20%;

}

div#wrap{width:100%;  margin:10% auto;}
div.newData{height:400px;font-size: 2.5em; background:#E0E0E0;background-size: cover; margin:10px 0px;}
div.newData .inner{height:50%; width: 30%; float: right; background:#E0E0E0;background-size: cover; margin:10px 0px; border: 5px solid black;}

div.newData0{height:400px;font-size: 2em; background:#99ccff; color: ;  margin:10px 0px;}
div.newData1{height:400px;font-size: 2em; background:#E0E0E0; margin:10px 0px; border: 3px solid black;}
div.newData1 img{height:100%; width: 30%; margin: 1%; border: 5px solid black;}

div.newData2{height:400px;font-size: 2em; background:#99ccff; color: ; margin:10px 0px;}
div.newData2 .inner{height:90%; width: 30%; float: right; background:#E0E0E0;background-size: cover; margin:1% 2%; border: 5px solid black;}
div.newData3{height:400px;font-size: 2em; background:#E0E0E0; margin:10px 0px; border: 5px solid black;}
div.newData4{height:400px;font-size: 2em; background:#99ccff; color: ; margin:10px 0px;}
div.newData5{height:400px;font-size: 2em; background:#91ccff; color: ;  margin:10px 0px;}
div.newData6{height:400px;font-size: 2em; background:white; margin:10px 0px; border: 5px solid black;}
div.newData7{height:400px;font-size: 2em; background:#99ecgf; color: ; border: 5px solid black; margin:10px 0px;}


.newData2{height:400px;font-size: 2em; background:#99ccff; color: ;  margin:10px 0px;}
.newData3{height:400px;font-size: 2em; background:#E0E0E0; margin:10px 0px; border: 5px solid black;}


#content{width:90%; height:800px; margin:0px auto;}

.inner-right{height:95%; width: 30%;  float: right; background:#E0E0E0;background-size: cover; margin:1% auto; border: 5px solid black;}
.center{height:95%; width: 30%; float:left ; background:#E0E0E0; background-size: cover; margin:1% auto ; border: 1px solid black;}
.inner-left{height:95%; width: 30%; float: left; background:#E0E0E0; background-size: cover; margin:1% auto; border: 5px solid black;}
.inner-big-left{height:95%; width: 60%; float: left; background:#E0E0E0; background-size: cover;margin:1% auto; border: 5px solid black;}
.inner-big-right{height:95%; width: 60%; float: right; background:#E0E0E0;background-size: cover; margin:1% auto; border: 5px solid black;}












.jumbotron {
		padding-top: 120px;
		padding-bottom: 20px;
		background-position: 10% 10%;
	}
	.ft-copy {
		padding-top: 12px;
	}
	.ft-copy p {
		width: auto;
	}
	.device {
		margin-top: 28px;
	}
}

#content{width:90%; height:800px; margin:0px auto;}




@media (max-width: 767px) {
		
#top ul li{
display: inline-block;
list-style-type: none;
position: relative;
font-size: 1em;
padding: .1%;
}		
#b1{
width: 100%;
height: 100%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
border: 1px solid black;
}


#art0{
	float: right;
	top: ;
   width: 95%;
   margin: 1% auto;
   height: 50%;
   background: ;
   border: 1px solid black;
   position: relative;
   -moz-border-radius:    5px;
   -webkit-border-radius: 5px;
   border-radius:        ;
}

#imgT{
float: left;
height: 10%;
width: 25%;
border: 2px solid black;
margin: 3px;
}
#typeBox{
float: left;
width: 95%;
height: 350px;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;
font-size: 22px;
border: 1px solid grey;
color: white ;
background-color:black;
}
#fadeText{
float: left;
width: 95%;
height: 35%;
margin-left: .5% ;
margin-top: 10px;
margin-right: 1%;

border: 1px solid grey;
color: white ;
background-color:black;

}
#fadeText1{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 1.35em;
color: white;
}
#fadeText2{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 1.35em;
color: blue;
}
#fadeText3{
font-size:32px;
display: none;
margin-left: 5%;
font-size: 1.35em;
color: yellow;
}
#fadeText4{
position:;
display: none;
margin-left: 3%;
margin-right: 3%;
font-size: 1.35em;
color: blue;
}
#adeText p {
    opacity: 0;
    margin-top: 25px;
    font-size: 30px;
	font-family: Swiss;
	color: white;
    text-align: center;
    -webkit-transition: opacity 4s ease-in;
    -moz-transition: opacity 4s ease-in;
    -o-transition: opacity 4s ease-in;
    -ms-transition: opacity 4s ease-in;
    transition: opacity 4s ease-in;
}
#adeText p.load {
    opacity: 1;
}







#Definition{
float: left;
width: 95%;
height: 45%;
margin-left: 1%;
margin-top: .5%;
margin-right: 1%;
font-size: 2em;
border: 2px solid grey;
color: black;
padding: 0%;
background-color: ;
}

.p5{

color: red;
font-size: .7em;
line-height:0%;
}
.p6{
color: black;
font-size: .4em;

}
.p7{
color: green;
font-size: .5em;
font-weight: bold;
}
.p8{
color: red;
font-size: .7em;
font-weight: bold;
}





#LowColumn{
width: 33%;
float: right;
height: 40%;
argin-left: 2%;
margin-top: 5%;
margin-right: ;
border: 1px solid black;
display: none;
}
#topLow{
width: 100%;
height: 20%;
border: 1px solid black;
margin: 0%;
margin-top: 0%;
text-align: center;
background-color: black;
color: white;
display: none;
}
 
.slide-img{
height: 50%;
width:75%;
display: none;
}


#wrap{
float: right;
margin-top:1%;
position: relative;
height:20%;

}






	.navbar {
		min-height: 60px;
	}
	.main-logo {
		width: 82px;
		margin-top: 20px;
	}
	.jumbotron {
		padding-top: 80px;
		margin-bottom: 32px;
	}
	.lead {
		margin-bottom: 40px;
	}
	.ft {
		margin-bottom: 16px;
	}
	hr {
		margin-bottom: 40px;
	}
	.callout {
		margin-top: 32px;
	}
}













/* Bottom part of old sheet

#art2{
float: ;
width: 95%;
height: 500px;
margin-left: 1%;
margin-top: 1%;
margin-right: 1%;
font-size: 22px;
border: 3px solid grey;
color: ;
background-color: ;
}

#talk{
	float: right;
	top: 2%;
   width: 55%;
   margin: 1%;
   height: 95%;
   background: ;
   border: 1px solid black;
   position: relative;
   -moz-border-radius:    5px;
   -webkit-border-radius: 5px;
   border-radius:         45px;
  
}
#talkbubble{
	float: right;
	top: px;
   width: 85%;
   height: 95%;
   background: grey;
   position: relative;
   -moz-border-radius:    5px;
   -webkit-border-radius: 5px;
   border-radius:         45px;
  
}

#talkbubble:before {
   content:"";
   position: absolute;
   right: 100%;
   top: 40%;
   width: 0;
   height: 0;
   border-top: 84px solid transparent;
   border-right: 90px solid grey;
   border-bottom: 32px solid transparent;
}



#xml{
margin-top: 1%;
width: 95%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
height: 800px;
border: 1px solid black;

}


#shella{
width: 90%;
height: 700px;
border: 1px solid black;
margin: 5%;
margin-top: 2%;
}
#b1a{
width: 33%;
height: 95%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
border: 1px solid black;
float: left;
}
#b2a{
width: 61%;
height: 60%;
margin-right: 2.5%;
margin-top: 1%;
border: 1px solid black;
float: right;
font-size: 18px;
}
#b3a{
width: 61%;
height: 30%;
margin-right: 2.5%;
margin-top: 1%;
border: 1px solid black;
float: right;
}
#img{
float: left;
height: 40%;
width: 40%;
border: 2px solid black;
margin: 3px;
}
#img1{
float: left;
height: 20%;
width: 40%;
border: 2px solid black;
margin: 3px;
}
.p1{
margin: 3px;
padding: 5px;

}




#shellg{
width: 90%;
height: 800px;
border: 1px solid black;
margin: 5%;
margin-top: 2%;
}
#b1g{
width: 95%;
height: 50%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
color: white;
border: 1px solid black;
background-image: url(image/building.jpg);
background-size: 100%;
}


#b2g{
width: 60%;
height: 40%;
margin-right: 1%;
margin-top: 1%;
border: 1px solid black;
float: right;
}
#b3g{
width: 35%;
height: 40%;
margin-right: 1%;
margin-top: 1%;
margin-left: 1%;
border: 1px solid black;
float: left;
}


#shellb{
width: 90%;
height: 700px;
border: 1px solid black;
margin: 5%;
margin-top: 2%;
}
#b1b{
width: 58%;
height: 95%;
margin: 1.5%;
margin-top: 1%;
margin-right: 1%;
border: 1px solid black;
float: left;
}
#b2b{
width: 36%;
height: 60%;
margin-right: 2.5%;
margin-top: 1%;
border: 1px solid black;
float: right;
}
#b3b{
width: 36%;
height: 30%;
margin-right: 2.5%;
margin-top: 1%;
border: 1px solid black;
float: right;
}
#imgb{
float: left;
height: 40%;
width: 40%;
border: 2px solid black;
margin: 3px;
}
