title css

static/title.css

@@ -7,7 +7,7 @@ body {
   	grid-template-columns: repeat(4, 1fr);
   	grid-gap: 10px;
   	position: absolute;
-  	top: 5%;
+  	top: 15%;
 	width: 96%;
 	height: auto;
 	left:2%;
@@ -77,16 +77,16 @@ h2{
 .viewnav {
 	position: fixed;
 	top:30%;
-	right:0%;
-	background-color: red ;
+	right:5%;
+	background-color: transparent;
 	width: 10%;
 	z-index: 10;
 	opacity: 0.7;
 }
 
 .collapsible2 {
-  	background-color: #777;
-	color: white;
+  	background-color: transparent;
+	color: black;
 	cursor: pointer;
 	padding: 0px;
 	width: 100%;
@@ -99,21 +99,22 @@ h2{
 	margin-top: 0px;
 }
 
-.active, .collapsible2:hover {
-  background-color: #555;
+.collapsible2:hover {
+  background-color: transparent;
+  color: blue;
 }
 
 .content2 {
-  position: relative;
-  /*padding: 0px 18px;*/
+  position: absolute;
   max-height: 0;
   overflow: hidden;
   width: 100%;
-  transition: max-height 0.2s ease-out;
-  background-color: grey;
+  transition: max-height 0.3s ease-out;
+  background-color: transparent;
   color: white;
   z-index: 10;
   text-align: center;
+  bottom: 50%;
 }
 
 
@@ -143,7 +144,7 @@ p {
   width: 110px;
   text-align: center;
   padding: 12px 0px;
-  background-color: grey;
+  background-color: transparent;
   cursor: pointer;
   font-size: 18px;
   margin-right: 5px;
@@ -187,7 +188,7 @@ p {
 }
 
 .active, .collapsible:hover {
-  background-color: #555;
+  background-color: transparent;
 }
 
 .content {
@@ -234,41 +235,15 @@ a.content:link {
 	display: none;
 }
 
-.indexlink {
-	position: fixed;
-	bottom:0%;
-	right:3%;
-	background-color: white;
-	z-index: 10;
-	font-size: 30px;
-}
-
-.timelinelink {
-	position: fixed;
-	bottom:0%;
-	left:5%;
-	background-color: white;
-	z-index: 10;
-	font-size: 30px;
-	padding-left: 
-}
-
 .orglink {
 	position: fixed;
 	bottom:0%;
-	left:10%;
+	left:18%;
 	background-color: white;
 	z-index: 10;
 	font-size: 30px;
 }
 
-/*.orglink {
-  position: fixed;
-  bottom:0%;
-  display: inline-block;
-  border-bottom: 1px dotted black;
-}*/
-
 .orglink .htext {
   visibility: hidden;
   width: 120px;
@@ -281,6 +256,7 @@ a.content:link {
 
   /* Position the tooltip */
   position: absolute;
+  left: 50px;
   z-index: 10;
 }
 
@@ -288,6 +264,16 @@ a.content:link {
   visibility: visible;
 }
 
+.timelinelink {
+	position: fixed;
+	bottom: 0%;
+	left: 3%;
+	background-color: white;
+	z-index: 10;
+	font-size: 30px;
+	padding: 0px 5px 0px 5px; 
+}
+
 .timelinelink .htext {
   visibility: hidden;
   width: 120px;
@@ -300,6 +286,7 @@ a.content:link {
 
   /* Position the tooltip */
   position: absolute;
+  left: 50px;
   z-index: 10;
 }
 
@@ -307,6 +294,15 @@ a.content:link {
   visibility: visible;
 }
 
+.indexlink {
+	position: fixed;
+	bottom:0%;
+	right:3%;
+	background-color: white;
+	z-index: 10;
+	font-size: 30px;
+}
+
 .indexlink .htext {
   visibility: hidden;
   width: 120px;
@@ -319,6 +315,7 @@ a.content:link {
 
   /* Position the tooltip */
   position: absolute;
+  right: 50px;
   z-index: 10;
 }