diff --git a/guestbook/templates/gb-header.php b/guestbook/templates/gb-header.php
index bf7e652..d390978 100644
--- a/guestbook/templates/gb-header.php
+++ b/guestbook/templates/gb-header.php
@@ -1,8 +1,8 @@
<section>
<h1>Guestbook</h1>
<p>Welcome to my guestbook!</p>
-<p><a href="index.php" class="btn">View guestbook</a>
-<a href="sign.php" class="btn">Sign guestbook</a></p>
+<p><a href="../../guestbook/index.php" class="btn">View guestbook</a>
+<a href="../../guestbook/sign.php" class="btn">Sign guestbook</a></p>
</section>
-<section>
\ No newline at end of file
+<section>
diff --git a/guestbook/templates/top.php b/guestbook/templates/top.php
index f05420d..3be554b 100644
--- a/guestbook/templates/top.php
+++ b/guestbook/templates/top.php
@@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<link rel="stylesheet" href="../../style/style.css">
+ <link rel="stylesheet" href="../../style/guestbook.css">
</head>
<body>
diff --git a/style/guestbook.css b/style/guestbook.css
new file mode 100644
index 0000000..011fb50
--- /dev/null
+++ b/style/guestbook.css
@@ -0,0 +1,38 @@
+:root {
+ --pagebg:#232c2f;
+ --pagecolor:#DCD7C9;
+ --border: #5b7e81;
+}
+
+ul.pages {
+ list-style:none;
+ margin:auto;
+ text-align:center;
+}
+
+ul.pages li { display:inline; }
+
+ul.pages li a, ul.pages li.active {
+ font-size: 1.2rem;
+ border: 1px solid var(--border);
+ padding:5px;
+ margin:2px;
+ transition:0.5s ease;
+ text-decoration:none;
+}
+
+ul.pages li.page a:hover {
+ background:var(--pagecolor);
+ color:var(--pagebg);
+ transition:0.5s ease;
+}
+
+ul.pages li.page a {
+ background: var(--pagebg);
+ color: var(--pagecolor);
+}
+
+ul.pages li.active {
+ background:var(--pagecolor);
+ color:var(--pagebg);
+}