<html>
<head>
	<title>Tree View</title>
	<!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	
	<!-- Admin CSS File Link -->
	<link rel="stylesheet" href="css/style2.css">
	<link rel="stylesheet" href="css/mediaStyle.css">
	
	<!-- Font Awesome Icone -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	
	<style>
		.div1{
			background:;
			width:98%;
			height:50px;
			margin:10px;
			text-align:center;
		}
		.div1 input{
			width:300px;
			height:40px;
			margin-top:5px;
			border-left:none;
			padding:2px 5px;
		}
		.div1 i{
			background:green;
			color:white;
			width:40px;
			height:39.5px;
			padding-top:10.5px;
			margin-top:5px;
		}
		
		.div2{
			background:;
			width:98%;
			height:auto;
			text-align:center;
			margin:10px;
		}
		#icon{
			font-size:50px;
			color:green;
		}
		.R1_D1{
			background:;
			width:100%;
			height:50px;
		}
		.R2_D1, .R2_D4{
			background:;
			width:25%;
			height:50px;
			float:left;
		}
		.R2_D2{
			background:;
			width:25%;
			height:50px;
			border-top:solid black 2px;
			border-left:solid black 2px;
			float:left;
		}
		.R2_D3{
			background:;
			width:25%;
			height:50px;
			border-top:solid black 2px;
			border-right:solid black 2px;
			float:left;
		}
		
		
		.R3_D1, .R3_D2{
			background:;
			width:50%;
			height:50px;
			float:left;
		}
		.R4_D1, .R4_D8, .R4_D4, .R4_D5{
			background:;
			width:12.5%;
			height:50px;
			float:left;
		}
		.R4_D2, .R4_D6{
			background:;
			width:12.5%;
			height:50px;
			border-top:solid black 2px;
			border-left:solid black 2px;
			float:left;
		}
		.R4_D3, .R4_D7{
			background:;
			width:12.5%;
			height:50px;
			border-top:solid black 2px;
			border-right:solid black 2px;
			float:left;
		}
		
		.R5_D1, .R5_D2, .R5_D3, .R5_D4{
			background:;
			width:25%;
			height:50px;
			float:left;
		}
		
		.R6_D1,.R6_D6, .R6_D7,.R6_D12, .R6_D13,.R6_D18, .R6_D19,.R6_D24{
			background:;
			width:4.167%;
			height:50px;
			float:left;
		}
		.R6_D2, .R6_D8, .R6_D14, .R6_D20{
			background:;
			width:4.167%;
			height:50px;
			border-top:solid black 2px;
			border-left:solid black 2px;
			float:left;
		}
		.R6_D5, .R6_D11, .R6_D17, .R6_D23{
			background:;
			width:4.167%;
			height:50px;
			border-top:solid black 2px;
			border-right:solid black 2px;
			float:left;
		}
		.R6_D3, .R6_D4, .R6_D9, .R6_D10, .R6_D15, .R6_D16, .R6_D21, .R6_D22{
			background:;
			width:4.167%;
			height:50px;
			border-top:solid black 2px;
			float:left;
		}
		
		.R7_D1, .R7_D2, .R7_D3, .R7_D4, .R7_D5, .R7_D6, .R7_D7, .R7_D8 {
			background:;
			width:8.333%;
			height:50px;
			float:left;
		}
	</style>
</head>
<body>
	<!--Header Divison-->
	<?php
		require'header.php';
	?>
	
	<!--Container Division-->
	<div class="container">
		<?php
			include'menu.php';
		?>
		<div class="content">
			<div class="head">
				<div class="title"><p>Tree View :-</p></div>
				<div class="msg"><marquee>This Is Test Message</marquee></msg>
			</div><hr>
			<div class="data-content">
				<div class="div1">
					<i class="fa fa-search"></i><input type="search" value="Search..">
				</div>
			</div><hr>
			<div class="div2">
				<div class="R1_D1"><i class="fa fa-user" id="icon"></i></div>
				<div class="R2_D1"></div>
				<div class="R2_D2"></div>
				<div class="R2_D3"></div>
				<div class="R2_D4"></div>
				
				<div class="R3_D1"><i class="fa fa-user" id="icon"></i></div>
				<div class="R3_D2"><i class="fa fa-user" id="icon"></i></div>
				
				<div class="R4_D1"></div>
				<div class="R4_D2"></div>
				<div class="R4_D3"></div>
				<div class="R4_D4"></div>
				<div class="R4_D5"></div>
				<div class="R4_D6"></div>
				<div class="R4_D7"></div>
				<div class="R4_D8"></div>
				                                               
				<div class="R5_D1"><i class="fa fa-user" id="icon"></i></div>
				<div class="R5_D2"><i class="fa fa-user" id="icon"></i></div>
				<div class="R5_D3"><i class="fa fa-user" id="icon"></i></div>
				<div class="R5_D4"><i class="fa fa-user" id="icon"></i></div>
				
				<div class="R6_D1"></div>
				<div class="R6_D2"></div>
				<div class="R6_D3"></div>
				<div class="R6_D4"></div>
				<div class="R6_D5"></div>
				<div class="R6_D6"></div>
				<div class="R6_D7"></div>
				<div class="R6_D8"></div>
				<div class="R6_D9"></div>
				<div class="R6_D10"></div>
				<div class="R6_D11"></div>
				<div class="R6_D12"></div>
				<div class="R6_D13"></div>
				<div class="R6_D14"></div>
				<div class="R6_D15"></div>
				<div class="R6_D16"></div>
				<div class="R6_D17"></div>
				<div class="R6_D18"></div>
				<div class="R6_D19"></div>
				<div class="R6_D20"></div>
				<div class="R6_D21"></div>
				<div class="R6_D22"></div>
				<div class="R6_D23"></div>
				<div class="R6_D24"></div>
				                                                        
				<div class="R7_D1"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D1"></div>
				<div class="R7_D2"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D3"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D1"></div>
				<div class="R7_D4"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D5"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D1"></div>
				<div class="R7_D6"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D7"><i class="fa fa-user" id="icon"></i></div>
				<div class="R7_D1"></div>
				<div class="R7_D8"><i class="fa fa-user" id="icon"></i></div>
			</div>
		</div>
	</div>
	<?php
		require'footer.php';
	?>
</body>
</html>