Advertisement
Guest User

Oversized navbar

a guest
Jan 28th, 2020
252
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.05 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <style>
  7. body {
  8. font-family: Arial, Helvetica, sans-serif;
  9. font-size: 20px;
  10. }
  11.  
  12. #myBtn {
  13. display: none;
  14. position: fixed;
  15. bottom: 20px;
  16. right: 30px;
  17. z-index: 99;
  18. font-size: 18px;
  19. border: none;
  20. outline: none;
  21. background-color: red;
  22. color: white;
  23. cursor: pointer;
  24. padding: 15px;
  25. border-radius: 4px;
  26. }
  27.  
  28. #myBtn:hover {
  29. background-color: #555;
  30. }
  31. </style>
  32.  
  33. <title>Tourist Destinations In Lithuania</title>
  34.  
  35. <style>img {display: block;margin: auto;}</style>
  36.  
  37. <style>
  38. a:visited {
  39. color: #c72aa2;
  40. }
  41. </style>
  42.  
  43. <style>
  44. body {
  45. background-color: #7c677f;
  46. }
  47. .center {
  48. display: block;
  49. margin-left: auto;
  50. margin-right: auto;
  51. }
  52. ul {
  53. list-style-type: none;
  54. margin: 0;
  55. padding: 0;
  56. overflow: hidden;
  57. background-color: #333;
  58. }
  59.  
  60. li {
  61. float: left;
  62. }
  63.  
  64. li a {
  65. display: block;
  66. color: white;
  67. text-align: center;
  68. padding: 14px 16px;
  69. text-decoration: none;
  70. }
  71.  
  72. li a:hover {
  73. background-color: #111;
  74. }
  75. </style>
  76.  
  77. <meta name="viewport" content="width=device-width, initial-scale=1">
  78. <style>
  79. * {box-sizing: border-box;}
  80. body {font-family: Verdana, sans-serif;}
  81. .mySlides {display: none;}
  82. img {vertical-align: middle;}
  83.  
  84. /* Slideshow container */
  85. .slideshow-container {
  86. max-width: 1000px;
  87. position: relative;
  88. margin: auto;
  89. }
  90.  
  91. /* Caption text */
  92. .text {
  93. color: #f2f2f2;
  94. font-size: 15px;
  95. padding: 8px 12px;
  96. position: absolute;
  97. bottom: 8px;
  98. width: 100%;
  99. text-align: center;
  100. }
  101.  
  102. /* Number text (1/3 etc) */
  103. .numbertext {
  104. color: #f2f2f2;
  105. font-size: 12px;
  106. padding: 8px 12px;
  107. position: absolute;
  108. top: 0;
  109. }
  110.  
  111. /* The dots/bullets/indicators */
  112. .dot {
  113. height: 15px;
  114. width: 15px;
  115. margin: 0 2px;
  116. background-color: #bbb;
  117. border-radius: 50%;
  118. display: inline-block;
  119. transition: background-color 0.6s ease;
  120. }
  121.  
  122. .active {
  123. background-color: #8076a3;
  124. }
  125.  
  126. /* Fading animation */
  127. .fade {
  128. -webkit-animation-name: fade;
  129. -webkit-animation-duration: 1.5s;
  130. animation-name: fade;
  131. animation-duration: 1.5s;
  132. }
  133.  
  134. @-webkit-keyframes fade {
  135. from {opacity: .4}
  136. to {opacity: 1}
  137. }
  138.  
  139. @keyframes fade {
  140. from {opacity: .4}
  141. to {opacity: 1}
  142. }
  143.  
  144. /* On smaller screens, decrease text size */
  145. @media only screen and (max-width: 300px) {
  146. .text {font-size: 11px}
  147. }
  148. </style>
  149.  
  150. </head>
  151.  
  152. <body>
  153.  
  154. <ul>
  155. <li><a href="information.html">Home Page</a></li>
  156. <li><a href="touristdestinations.html">Tourist Destinations</a></li>
  157. <li><a href="famousplaces.html">Famous Places</a></li>
  158. <li><a href="historicalsites.html">Historical Sites</a></li>
  159. </ul>
  160. <h1 align="center" style="font-family:verdana;"><br>Tourist Destinations In Lithuania</h1>
  161. <h4 align="center" style="font-family:verdana;"><br><p><abbr title="Lithuania">Lit</abbr></p></h4>
  162. <h2 align="center" style="font-family:verdana;"><br>Vilnius<br><br></h2>
  163.  
  164.  
  165. <p align="center">Vilnius, Lithuania’s capital, is known for its baroque architecture, seen especially in its medieval Old Town.<br>
  166. But the buildings lining this district’s partially cobblestoned streets reflect diverse styles and eras, from the neoclassical Vilnius Cathedral to Gothic St. Anne's Church.<br>
  167. The 16th-century Gate of Dawn, containing a shrine with a sacred Virgin Mary icon, once guarded an entrance to the original city.<br></p>
  168.  
  169. <div class="slideshow-container">
  170.  
  171. <div class="mySlides fade">
  172. <div class="numbertext">1 / 3</div>
  173. <img src="images/Vilnus-Lithuania.jpg" style="width:100%">
  174. <div class="text">Image of Vilnius (1)</div>
  175. </div>
  176.  
  177. <div class="mySlides fade">
  178. <div class="numbertext">2 / 3</div>
  179. <img src="images/Vilnus-Lithuania2.jpg" style="width:100%">
  180. <div class="text">Image of Vilnius (2)</div>
  181. </div>
  182.  
  183. <div class="mySlides fade">
  184. <div class="numbertext">3 / 3</div>
  185. <img src="images/Vilnus-Lithuania3.jpg" style="width:100%">
  186. <div class="text">Image of Vilnius (3)</div>
  187. </div>
  188.  
  189. </div>
  190. <br>
  191.  
  192. <div style="text-align:center">
  193. <span class="dot"></span>
  194. <span class="dot"></span>
  195. <span class="dot"></span>
  196. </div>
  197.  
  198. <script>
  199. var slideIndex = 0;
  200. showSlides();
  201.  
  202. function showSlides() {
  203. var i;
  204. var slides = document.getElementsByClassName("mySlides");
  205. var dots = document.getElementsByClassName("dot");
  206. for (i = 0; i < slides.length; i++) {
  207. slides[i].style.display = "none";
  208. }
  209. slideIndex++;
  210. if (slideIndex > slides.length) {slideIndex = 1}
  211. for (i = 0; i < dots.length; i++) {
  212. dots[i].className = dots[i].className.replace(" active", "");
  213. }
  214. slides[slideIndex-1].style.display = "block";
  215. dots[slideIndex-1].className += " active";
  216. setTimeout(showSlides, 4000);
  217. }
  218. </script>
  219.  
  220. <script>
  221. //Get the button
  222. var mybutton = document.getElementById("myBtn");
  223.  
  224. // When the user scrolls down 20px from the top of the document, show the button
  225. window.onscroll = function() {scrollFunction()};
  226.  
  227. function scrollFunction() {
  228. if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
  229. mybutton.style.display = "block";
  230. } else {
  231. mybutton.style.display = "none";
  232. }
  233. }
  234.  
  235. // When the user clicks on the button, scroll to the top of the document
  236. function topFunction() {
  237. document.body.scrollTop = 0;
  238. document.documentElement.scrollTop = 0;
  239. }
  240. </script>
  241.  
  242. <h2 align="center" style="font-family:verdana;"><br>Trakai Castle<br><br></h2>
  243.  
  244.  
  245. <p align="center">Trakai is a lake resort and historically important city that sits close to Vilnius and makes a nice day trip if you are looking to get out of town.<br>
  246. Trakai dates from the 13th century and is also the home of the Trakai Historical National Park that dates from 1991.<br>
  247. One of the main sights in the city is the Island Castle which is also the host of the Trakai Castle Festival and the entire town is surrounded by pretty water.<br>
  248. In the wider Trakai region there are some 200 lakes to enjoy during the warmer months.<br></p>
  249. <a href="https://trakaimuziejus.lt/island-castle"><p style="text-align:center">A Link to the Trakai Castle</a>
  250.  
  251.  
  252. <img src="images/Trakai_Castle.jpg"alt=”A castle in lithuania” style="width:1005px;height:700px;">
  253.  
  254.  
  255. <h2 align="center" style="font-family:verdana;"><br>The Devil’s Museum<br><br></h2>
  256.  
  257.  
  258. <p align="center">The Devil’s Museum is found in Kaunas and as you would expect from the name it has a huge collection of art work that depict images of the devil, witches, and a range of other wicked mythological creatures.<br>
  259. You will find over 3,000 different pieces here and visitors can even donate items to the collection.<br>
  260. There are a huge range of works here that use different materials such as ceramics, textiles, and paintings and you can even find other interesting items like pebbles that feature images of the devil.<br></p>
  261.  
  262.  
  263. <img src="images/DevilsMuseum.jpg"alt=”The devils museum” style="width:1005px;height:700px;">
  264.  
  265.  
  266. <h2 align="center" style="font-family:verdana;"><br>Ginuciai Water Mill<br><br></h2>
  267.  
  268.  
  269. <p align="center">Nestled close to Ignalina is the Ginuciai Water Mill which dates from the 19th century and still straddles the waters that travel down to scenic Lake Linkmenas.<br>
  270. In the days of old it would have been used to make flour and produce electricity although now it is a museum that also has a hotel attached.<br>
  271. It is famous for being the only remaining wooden mill in Lithuania and you can still see all of its traditional machinery such as water wheels and mill stones.</p>
  272.  
  273.  
  274. <img src="images/Ginuciai-Water-Mill.jpg"alt=”The Ginuciai Water Mill” style="width:1005px;height:700px;">
  275.  
  276.  
  277. <p align="right">&copy;Copyright&copy Web Design 2019-2020 -All Rights Reserved.<br>&euro; ‎<br>&trade; ‎</p>
  278.  
  279.  
  280.  
  281. <button onclick="goBack()">Go Back</button>
  282. <script>
  283. function goBack() {
  284. window.history.back();
  285. }
  286. </script>
  287.  
  288.  
  289.  
  290. <input type="button" name="b1" value="Next page" onclick="location.href='famousplaces.html'">
  291. <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
  292. </body>
  293. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement