html, body{
  height:100%;
}

body {
	margin: 0;
	padding:0;
	background-color: #F8F9F9;
}

#overlay{
	position: fixed; 
	width: 896px; 
	height: 498px; 
	top: 0; 
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.9); 
	z-index: 2; 
}

#overlay{
display: block; 
}

#text{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	text-align: center;
}

.intro{
background-color: transparent;
width: 500px;
color:#ffffff;

}

.intro h1{
	color:#ffffff;
}



.tab-master {
	width: 100%;
	max-width: 898px;
	height: 100%;
	max-height: 498px; /* use this property to set the widget height*/
	position: relative;
}

.tab-content {
	height: calc(100% - 42px); 
	border-left: 1px solid #C6CDD0;
	border-right: 1px solid #C6CDD0;
	border-bottom: 1px solid #C6CDD0;
	overflow: hidden;
	
}

.tab-pane {
	height: 100%; 
}

.nav-pills > li, .nav-pills-sm > li {
  width: calc(99.9% / 3); /* change the denominator here to equal the number of tabs */
}

#home{
	background-image: url("../img/one.png");
	background-repeat: no-repeat;
	background-size: 100%;
}

#menu1{
	background-image: url("../img/two.png");
	background-repeat: no-repeat;
	background-size: 100%;
}

#menu2{
	background-image: url("../img/three.png");
	background-repeat: no-repeat;
	background-size: 100%;
}

.po{
	position: absolute;
	top:6em;
	left:20em;
}