Assignment1-HTML-CSS/product.html at master · vishalsingh31/Assignment1-HTML-CSS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html>
<head>  <!--Head Section Starts Here  -->
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/text.css">
	<link rel="stylesheet" type="text/css" href="css/960_12_col.css">
	<link rel="stylesheet" href="css/font-awesome.min.css">
	<link href='https://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
	<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" type="text/css" href="css/product.css">
	<title>Products-VS Solutions</title>
</head>  <!--Head Section Ends Here  -->
<body>
	<div class="container_12">
		<header class="grid_12">  <!--Header Section Starts Here  -->
			<h1>VS Solutions</h1>
			<nav>
				<ul>
					<li><a href="index.html">Home</a></li>
					<li><a href="#">Login</a></li>
					<li><a href="#">Projects</a></li>
					<li><a href="product.html" class="selected">Products</a></li>
					<li><a href="#">Purchase</a></li>
					<li><a href="#">About Us</a></li>
				</ul>
			</nav>
			<hr>
		</header>  <!--Header Section Ends Here  -->
		<div class="grid_12 product_heading">
			<h1>Products</h1>
		</div>
		<div class="main_section grid_12 clearfix">  <!--Main section divided into 3 column section  -->
			<div class="grid_4 applications_section alpha">
				<img src="img/applications_image.jpg">
				<h2>
					<a href="#">Applications</a>
				</h2>
			</div>
			<div class="grid_4 database_section">
				<img src="img/database_image.png">
				<h2><a href="#">Database</a></h2>
			</div>
			<div class="grid_4 engineered_systems_section omega">
				<img src="img/engineered-systems_image.png">
				<h2><a href="#">Engineered Systems</a></h2>
			</div>
		</div>
		<div class="main_section_bottom grid_12 clearfix">
			<div class="grid_4 web_tools_section alpha">
				<img src="img/web_tools_image.png">
				<h2>
					<a href="#">Web Tools</a>
				</h2>
			</div>
			<div class="grid_4 enterprise_management_section">
				<img src="img/enterprise_management_image.png">
				<h2><a href="#">Enterprise Management</a></h2>
			</div>
			<div class="grid_4 more_products_section omega">
				<img src="img/more_products_image.jpg">
				<h2><a href="#">More Products</a></h2>
			</div>
		</div>
		<footer>   <!--Footer Section Ends Here  -->
				<div class="grid_12">
					<div class="grid_2 alpha footer_first_section">
						<ul>
						<li>Company</li>
						<li><a href="#">Overview</a></li>
						<li><a href="#">Value Proposition</a></li>
						<li><a href="#">IP Protection & Data</a></li>
						<li><a href="#">Security</a></li>
						<li><a href="#">Locations</a></li>
						<li><a href="#">Contact Us</a></li>
						</ul>
					</div>
					<div class="grid_2">
						<ul>
						<li>Software & Solutions</li>
						<li><a href="#">Overview</a></li>
						<li><a href="#">Technology</a></li>
						<li><a href="#">Industry Solutions</a></li>
						</ul>
					</div>
					<div class="grid_2">
						<ul>
						<li>Services</li>
						<li><a href="#">Overview</a></li>
						<li><a href="#">Application Development</a></li>
						<li><a href="#">Cloud Computing</a></li>
						<li><a href="#">Product Development</a></li>
						<li><a href="#">Application Testing</a></li>
						</ul>
					</div>
					<div class="grid_2">
						<ul>
						<li>Success Stories</li>
						<li><a href="#">Case Studies</a></li>
						<li><a href="#">Careers</a></li>
						<li><a href="#">Getting Hired</a></li>
						<li><a href="#">Open Positions</a></li>
						<li><a href="#">Blog</a></li>
						</ul>
					</div>
					<div class="grid_4 omega footer_last_section">
					<ul class="first_list">
						<li><a href="#" data-toggle="tooltip" title="Facebook"><i class="fa fa-facebook-official fa-2x" aria-hidden="true"></i></a></li>
						<li><a href="#" data-toggle="tooltip" title="Twitter"><i class="fa fa-twitter fa-2x" aria-hidden="true"></i></a></li>
						<li><a href="#" data-toggle="tooltip" title="LinkedIn"><i class="fa fa-linkedin fa-2x" aria-hidden="true"></i></a></li>
						<li><a href="#" data-toggle="tooltip" title="Google +"><i class="fa fa-google-plus fa-2x" aria-hidden="true"></i></a></li>
					</ul>
					<ul>
						<li><h2>VS Solutions</h2></li>
						<li>copyright@2014 VS Solutions</li>
						<li><a href="#">Private Policy</a></li>
						<li><a href="#">Terms of Use</a></li>
					</ul>
					</div>
				</div>
			</footer>  <!--Footer Section Ends Here  -->
		</div>
</body>
</html>