/*div{
	border: 1px solid red;
}*/
/*.jumbotron div{
	border: 1px solid white;
}*/

/*#banner{
	background-color: darkorange;
}*/

.jumbotron{
	/*position: relative;
	background: #000 url("http://pr.ntnu.edu.tw/archive/adbig/8578da744e1927970e1941a085677f8a.jpg");
	width:auto;
	height: 400px;
	background-size: cover;
	overflow: hidden;
	margin-bottom: 0;
	color: white;
	text-shadow: 3px 3px black;*/


	position: relative; 
    background: #000 url("http://pr.ntnu.edu.tw/archive/adbig/8578da744e1927970e1941a085677f8a.jpg") center center; 
    z-index=-1; 
    background-attachment: fixed; 
    background-position: top; 
    width: auto; 
    height: 500px; 
    background-size: 100% auto; 
    overflow: hidden; 
    color:azure; 
    margin-bottom: 0; 
}

.jumbotron div{
	margin-top : 160px;
	margin-left : 530px;
	margin-right: 530px;
	padding : 0px;
	border: 5px solid white;
	box-shadow: 1px 1px black;
}

.jumbotron div:hover{
	margin-top : 180px;
	margin-left : 530px;
	margin-right: 530px;
	padding: 0px;
	border: 0px;
	box-shadow: 0px 0px;
}



.navbar-inverse .navbar-brand:hover{
	color: red;
}

.navbar-inverse {
    background-color: whitesmoke;
    border-color: #080808;
}

#n1{
	color:white;
	background-color: red;
}
#n2{
	color:white;
	background-color: green;
}
#n3{
	color:white;
	background-color: blue;
}
#n4{
	color:white;
	background-color: purple;
}

#n5{
	color:white;
	background-color: pink;
}
#footer{
	color:black;
	background-color: gray;
}


 .person { 
      border: 10px solid white; 
      margin-bottom: 25px;
      opacity: 0.8; 
 } 
 .person:hover { 
      border-color: #333333; 
 } 


 #myVideo{ 
    /*position: absolute; 
    right: 0; 
    bottom: 0; 
    top:0; 
    right:0; */
    width: 100%;
    height: 100%; 
    background-size: 100% 100%; 
    background-color: black; /* in case the video doesn't fit the whole page*/ 
    background-image: /* our video */; 
    background-position: center center; 
    background-size: contain; 
    object-fit: cover; /*cover video background */ 
    z-index:3; 
}




#section0{ 
    overflow: hidden; 
    padding: 0px 
}

.affix { 
      top: 0; 
      width: 100%; 
      z-index: 4;
}

.affix + .container-fluid { 
      padding-top: 70px; 
}

#protrait{
	width: 100%;
	height: 200px;
	background-color:gray;
}

#video-blk{
	width:100%;
	height: 700px;
}







#foot{
	color: white;
	background-color: blue;
}


#students{ 
    background: #000 url("https://www.elastica.net/wp-content/uploads/2014/03/2014-03-DataScienceA-1480x760.jpg") center top; 
    z-index=-2; 
    background-attachment: fixed; 
    background-position: top; 
    width: 100%; 
    height: 600px; 
    background-size:cover; 
} 
#students .row:first-child{ 
    position:relative; 
    box-shadow: 0px 5px 20px black; 
    background-color: #2d2d30; 
    color: white; 
}

#statistical{
    position: relative;
    top: 0;
    left: 0;
    height: 1000px;
    background:whitesmoke;
}

.iframe-container {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.iframe-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}