use the css from the online version

1 files changed, 246 insertions, 141 deletions

diff --git a/webAO/stylesheet.css b/webAO/stylesheet.css
index 6881909..322cdf9 100644
--- a/webAO/stylesheet.css
+++ b/webAO/stylesheet.css
@@ -1,75 +1,8 @@
-body {
-	background-color: #FFF8F0;
-	background: url(images/background.png) no-repeat left top fixed;
-	background-size: cover;
-	background-attachment: fixed;
-	font-family: "Ace Attorney", "Tahoma", Sans;
-	transition: ease-in-out;
-}
-
-#content {
-	margin-left: 200px;
-	margin-top: 200px;
-	font-family: "Ace Attorney", "Tahoma", Sans;
-}
-
-#content h1 {
-	text-align: center;
-	font-family: serif;
-}
-
-#logo {
-	background-color: rgba(0, 0, 0, 0.5);
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	width: 200px;
-	height: 200px;
-	position: fixed;
-	top: 0px;
-	left: 0px;
-	border-radius: 0px 0px 10px 0px;
-	z-index: 1;
-}
-
-#logo img {
-	width: 100px;
-	height: 100px;
-	vertical-align: center;
-	display: block;
-	margin-left: auto;
-	margin-right: auto;
-}
-
-#logo p {
-	color: #FFF;
-	text-align: center;
-}
-
-#header {
-	position: fixed;
-	display: block;
-	top: -3px;
-	left: 202px;
-	height: 100px;
-	width: 100%;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	border-top-color: #FFF;
-	vertical-align: center;
-	color: white;
-	background: url('images/header.jpg') no-repeat;
-	background-color: rgba(0, 0, 0, 0.5);
-	background-size: 100% 100%;
-	z-index: 1;
-}
-
-#header p {
-	display: inline;
-}
-
 #serverinfo {
 	margin-top: 75px;
 	margin-bottom: 0px;
 	float: left;
-	font-size: 0.6em;
+	font-size:0.6em;
 }
 
 #clientinfo {
@@ -77,7 +10,7 @@ body {
 	display: block;
 	float: left;
 	clear: both;
-	font-size: 0.6em;
+	font-size:0.6em;
 }
 
 #hotlinebtn {
@@ -93,8 +26,8 @@ body {
 	left: 0px;
 	width: 150px;
 	height: 100%;
-	background-color: rgba(0, 0, 0, 0.5);
-	border: 2px solid rgba(255, 255, 255, 0.7);
+	background-color: rgba(0,0,0,0.5);
+	border: 2px solid rgba(255,255,255,0.7);
 	z-index: 1;
 }
 
@@ -106,14 +39,14 @@ body {
 	background-image: url(images/button.png);
 	border: 1px solid #553e30;
 	border-radius: 5px;
-	box-shadow: 0 0 0 1px #FFFFFF;
+	box-shadow: 0 0 0 1px #FFFFFF; 
 	color: white;
 	text-align: center;
-	text-shadow:
-		0px -1px 0 #612000,
-		1px 0px 0 #612000,
-		-1px 0px 0 #612000,
-		0px 1px 0 #612000;
+    text-shadow:
+    0px -1px 0 #612000,
+    1px 0px 0 #612000,
+    -1px 0px 0 #612000,
+    0px 1px 0 #612000;
 	padding: 11px;
 	font-family: Times New Roman, sans;
 	font-weight: normal;
@@ -135,7 +68,7 @@ body {
 	height: 200px;
 	width: 200px;
 	border-image: url(images/sel.png) 11 stretch !important;
-	border-width: 11px;
+	border-width:11px;
 	padding: 1px;
 }
 
@@ -183,7 +116,7 @@ body {
 	top: 50px;
 	width: 200px;
 	height: 200px;
-	transform: rotateY(15deg);
+	transform: rotateY( 15deg);
 	float: left;
 }
 
@@ -211,7 +144,6 @@ body {
 	text-align: center;
 	cursor: default;
 }
-
 .servs li:hover {
 	background-color: #FFFF6B;
 	border-color: #EFAD21;
@@ -234,7 +166,7 @@ body {
 	padding-top: 10px;
 	border-radius: 0px 5px 5px 0px;
 	width: 50px;
-	box-shadow: 0 0 0 2px #BBB;
+	box-shadow: 0 0 0 2px #BBB; 
 }
 
 .servs .available {
@@ -245,20 +177,21 @@ body {
 .servs .unavailable {
 	background-color: #ff6b6B;
 	border-color: #ad2121;
+    display: none;
 }
 
 .servs .button:hover {
-	box-shadow: 0 0 0 1px #EFAD21;
+	box-shadow: 0 0 0 1px #EFAD21; 
 }
 
 .hotline {
 	background-image: url(images/background1.png);
 	color: #C5B011;
-	text-shadow:
-		0px -1px 0 #000,
-		1px 0px 0 #000,
-		-1px 0px 0 #000,
-		0px 1px 0 #000;
+    text-shadow:
+    0px -1px 0 #000,
+    1px 0px 0 #000,
+    -1px 0px 0 #000,
+    0px 1px 0 #000;
 	font-weight: normal;
 	text-align: center;
 }
@@ -283,7 +216,6 @@ body {
 	margin-left: auto;
 	margin-right: auto;
 }
-
 #content p {
 	vertical-align: top;
 	display: inline-block;
@@ -292,8 +224,8 @@ body {
 
 #client_name {
 	height: 12px;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background: rgba(73, 0, 254, 0.5);
+	border: 2px solid rgba(255,255,255,0.7);
+	background:rgba(73,0,254,0.5);
 	zoom: 1;
 	top: 114px;
 	margin: 0px;
@@ -341,8 +273,8 @@ body {
 #client_chat {
 	width: 198px;
 	height: 68px;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background-color: rgba(0, 0, 0, 0.5);
+	border: 2px solid rgba(255,255,255,0.7);
+	background-color: rgba(0,0,0,0.5);
 	top: 128px;
 	margin: 0px;
 	display: block;
@@ -352,66 +284,239 @@ body {
 
 #client_chat p {
 	margin: 3px;
-	font-size: 10px;
+	font-size:10px;
 	color: white;
 	font-family: Arial;
 
 }
 
-.blogpost h2 {
-	text-align: center;
-	height: 24px;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background: rgba(30, 150, 0, 0.5);
-	zoom: 1;
-	top: -26px;
-	margin: auto;
-	display: inline;
-	border-radius: 2px;
-	position: absolute;
-	padding-left: 4px;
-	padding-right: 4px;
-	font-weight: normal;
+#content > p {
+	margin-right: 50px;
+}
 
+ul.navbar-nav.ml-auto {
+    display: inline-flex;
+    list-style-type: none;
 }
 
-.blogpost {
-	margin: 3px;
-	font-size: 14px;
-	color: white;
-	display: block;
-	font-family: Arial;
-	min-height: 100px;
-	width: 50%;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background-color: rgba(0, 0, 0, 0.5);
-	margin: 0px;
-	display: block;
-	border-radius: 2px;
-	position: relative;
-	margin: 50px;
-	padding-bottom: 20px;
+nav.navbar.fixed-top.navbar-expand-lg.navbar-dark.bg-dark.fixed-top{
+    background: black;
 }
 
-.blogpost p {
-	padding-left: 20px;
+body{
+    margin: 0px;
 }
 
-.signature {
-	height: 16px;
-	border: 2px solid rgba(255, 255, 255, 0.7);
-	background: rgba(73, 0, 254, 0.5);
-	zoom: 1;
-	bottom: -18px;
-	right: 0px;
-	margin: 0px;
-	display: block;
-	border-radius: 2px;
-	position: absolute;
-	padding-left: 4px;
-	padding-right: 4px;
+/*!
+ * Start Bootstrap - Modern Business (https://startbootstrap.com/template-overviews/modern-business)
+ * Copyright 2013-2017 Start Bootstrap
+ * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-logomodern-business-nav/blob/master/LICENSE)
+ */
+
+.carousel-item {
+  height: 65vh;
+  min-height: 300px;
+  background: no-repeat center center scroll;
+  -webkit-background-size: cover;
+  -moz-background-size: cover;
+  -o-background-size: cover;
+  background-size: cover;
 }
 
-#content>p {
-	margin-right: 50px;
-}
\ No newline at end of file
+.portfolio-item {
+  margin-bottom: 30px;
+}
+
+.navbar {
+ font-family: 'Poiret One', cursive;
+ text-transform: uppercase;
+ font-size:22px;
+}
+
+.navbar-dark .navbar-nav .nav-link {
+  margin-right: 25px;
+  color: white !important;
+}
+
+.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
+ color: rgba(255, 229, 145, .75)!important;
+ opacity: 100 !important;
+}
+
+body {
+  background: #2c3d51;
+  color: white;
+  font-family: 'Roboto Condensed', sans-serif;
+}
+
+.page-heading{
+ font-family: 'Oswald', sans-serif;
+ text-transform: uppercase;
+ margin-top: 5px;
+ text-align: center;
+}
+
+hr.gold {
+border-top: 10px solid #f3b137;
+width: 250px;
+}
+
+.about {
+  text-align: center;
+}
+
+.card-body {
+background-color: #473322; 
+font-family: 'Roboto Condensed', sans-serif;
+}
+
+.card-header {
+background-color: #2f2216;
+border-bottom: 1px solid #ffe591;
+font-family: 'Roboto Condensed', sans-serif;
+border-radius: 0px !important;
+}
+
+.card-header a {
+  color: #ffe591 !important;
+}
+
+.card {
+  border: 1px solid #ffe591;
+  border-radius: 0px !important;
+}
+
+@media (max-width:411px) {
+  .top-bois {
+    display: none !important;
+  }
+}
+
+.top-bois {
+  display: inline-table;
+  width: 100%;
+}
+
+.carousel-item {
+  height: 90vh;
+  background-size: contain;
+}
+
+.carousel-inner {
+  background-color: #2c3d51;
+}
+
+@media (max-width:980px){
+  .carousel-item {
+  background-size: cover;
+}
+}
+
+h1 {
+ font-family: 'Poiret One', cursive;
+ text-transform: uppercase;
+}
+
+a {
+  color: #ffe591!important;
+}
+
+@media (max-width:576px){
+.borderbox{
+  padding: 0px 20px 0px 20px;
+}
+}
+
+.inside-carousel {
+  position:relative;
+}
+
+.button-carousel, .tagline-carousel {
+  right: 0;
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  margin: auto;
+  text-align: center;
+}
+
+.button-carousel {
+      background-color: #2f2216;
+    max-width: 200px;
+    padding: 30px;
+    border: 2px solid #ffe591;
+    color: white !important;
+    border-radius: 15px;
+}
+
+.button-carousel p{
+  margin-top: -17px;
+  font-family: 'Poiret One', cursive;
+ text-transform: uppercase;
+     font-size: 24px;
+}
+
+.download-button h4 {
+  font-family: 'Poiret One', cursive;
+ text-transform: uppercase;
+ margin-bottom:0px;
+}
+
+.button-carousel a, .download-button a {
+  color: white !important;
+}
+
+.download-button{
+  background-color: #2f2216;
+    max-width: 400px;
+    padding: 10px;
+    text-align: center;
+    border: 2px solid #ffe591;
+    color: white !important;
+    border-radius: 15px;
+    margin: 0 auto;
+}
+
+.card {
+  background-color: #2c3d51;;
+}
+
+.download-box strong {
+  color:#ffe591;
+}
+.download-box a, .download-button a, .links a, .card a {
+  text-decoration: underline;
+}
+
+.acc {
+  text-decoration: none !important;
+}
+
+a:hover{
+  opacity: 0.8;
+}
+
+.navbar .container {
+    text-align: center;
+}
+
+a.nav-link {
+    text-decoration: none !important;
+}
+
+ul.servs p {
+    color: black;
+}
+
+a.nav-link {
+    padding: 8px;
+}
+
+ul.navbar-nav.ml-auto{
+    margin-top: 19px;
+ padding: 0;
+}
+
+nav.navbar.fixed-top.navbar-expand-lg.navbar-dark.bg-dark.fixed-top{
+    height: 65px;
+}