Dualtech/servicos.html at main · luispaulo21/Dualtech · 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
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!DOCTYPE html>
<html lang="pt-br">

	<head>
		<meta charset="utf-8" />
		<title>Dualtech - Serviços</title>

		<!-- Estilos de reset -->
		<link rel="stylesheet" type="text/css" href="css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="css/reset.css" />

		<!-- Folhas de estilização do site -->
		<link rel="stylesheet" type="text/css" href="css/grid.css" />
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<link rel="stylesheet" type="text/css" href="css/servicos.css" />
		<link rel="stylesheet" type="text/css" href="css/responsivo.css" />

		<style>
			.main__menu {
				justify-content: flex-end;
			}

			.main__menu nav {
				margin-right: 0;
			}

			.main__menu .items__item a {
				border-color: var(--cor-primaria);
			}

			.main__menu .items__back,
			.main__menu .items__next,
			.main__menu .item--ativo {
				background: var(--cor-primaria);
			}

			.main__menu .items__next a {
				background: url("img/next-blue.svg") no-repeat center center;
			}

			.main__menu .items__back a {
				background: url("img/back-blue.svg") no-repeat center center;
			}

		</style>
	</head>

	<body>
		<div class="global__box container">
			<!-- INÍCIO DO HEADER -->
			<header class="main__header grid-16">
				<ul class="header__items grid-9">
					<li class="items__path grid-5">
						<span class="grid-3">
							Serviços
						</span>
					</li>
					<li class="items__logo">
						<a href="index.html">
							Dualtech
						</a>
					</li>
				</ul>
			</header>
			<!-- FIM DO HEADER -->

			<div class="content__menu">
				<!-- INÍCIO DA SEÇÃO SERVIÇOS -->
				<section class="services__section grid-12">
					<div class="carousel__box grid-10">
						<div class="box__section grid-10">
							<h1 class="services__title grid-8">
								Manutenção em impressoras
							</h1>
							<p class="services__description grid-9">
								Oferecemos os seguintes serviços: limpeza, revisão, recarga de cartucho, troca de peças e muito mais. Entre em contato com a gente e conheça mais sobre o nosso trabalho.
							</p>
							<nav class="services__menu">
								<ul class="menu__items">
									<li class="items__item pages__count">
										1/2
									</li>
									<li class="items__item item__next">
										<button class="btn__next">
											<img src="img/next-slide.svg" alt="ir para o próximo slide" />
										</button>
									</li>
								</ul>
							</nav>
						</div>
						<div class="box__section grid-10" >
							<h1 class="services__title grid-8">
								Manutenção em computadores
							</h1>
							<p class="services__description grid-9">
								Fazemos manutenção apenas em computadores de mesa(desktop), oferecendo os seguintes serviços: formatação, instalação de sistemas e programas, limpeza, dualboot(dois sistemas em um mesmo computador), remoção de vírus e muito mais. Entre em contato para saber mais detalhes.
							</p>
							<nav class="services__menu">
								<ul class="menu__items">
									<li class="items__item item__back">
										<button class="btn__back">
											<img src="img/back-slide.svg" alt="voltar para o slide anterior" />
										</button>
									</li>
									<li class="items__item pages__count">
										2/2
									</li>
								</ul>
							</nav>
						</div>
					</div>
				</section>
				<!-- FIM DA SEÇÃO SERVIÇOS -->

				<!-- INÍCIO DO MENU LATERAL (PRINCIPAL) -->
				<aside class="main__menu grid-4">
					<nav class="grid-nav">
						<ul class="menu__items">
							<li class="items__back">
								<a href="index.html">
								</a>
							</li>
							<li class="items__item">
								<a href="index.html"></a>
							</li>
							<li class="items__item">
								<a class="item--ativo" href="servicos.html"></a>
							</li>
							<li class="items__item">
								<a href="contato.html"></a>
							</li>
							<li class="items__next">
								<a href="contato.html">
								</a>
							</li>
						</ul>
					</nav>
				</aside>
				<!-- FIM DO MENU LATERAL (PRINCIPAL) -->
			</div>
		</div>

		<script src="js/script.js"></script>
	</body>

</html>